/* Directory Structure Mode Styles */
.achang-pt-directory-mode .achang_pt-category-container {
    display: flex;
    align-items: center;
}

/* Hide the default toggle icon if we want a pure directory look, 
   OR style it to look like a tree expander */
.achang-pt-directory-mode .achang_pt-toggle-icon {
    font-family: monospace;
    margin-right: 5px;
    cursor: pointer;
}

/* Add Folder Icon for Categories */
.achang-pt-directory-mode .achang_pt-category-item::before {
    content: "📁"; /* Folder Emoji */
    margin-right: 6px;
    font-size: 1.1em;
    vertical-align: middle;
    display: inline-block;
}

/* Differentiate open folders if possible - requires JS toggling class on parent 
   Assuming 'has-children' isn't toggled by JS on click, but maybe a 'open' class is? 
   Checking frontend.js/category-tree.js would confirm. 
   For now, basic folder is fine. */

/* Add File Icon for Posts */
.achang-pt-directory-mode .achang_pt-post-item a::before {
    content: "📄"; /* Page/File Emoji */
    margin-right: 6px;
    font-size: 1em;
    vertical-align: middle;
    display: inline-block;
}

/* Indentation lines improvements for directory mode */
.achang-pt-directory-mode .achang_pt-category-children,
.achang-pt-directory-mode .achang_pt-post-list {
    border-left: 1px dashed #ccc;
    margin-left: 5px; /* Adjust alignment */
    padding-left: 15px;
}

/* Remove default lines if they conflict */
.achang-pt-directory-mode.achang_pt-with-lines section {
    border-left: none; /* Override default line if necessary */
}

/* Adjust post item alignment */
.achang-pt-directory-mode .achang_pt-post-item {
    margin: 2px 0;
    line-height: 1.5;
}

/* Hover effects */
.achang-pt-directory-mode .achang_pt-category-item:hover,
.achang-pt-directory-mode .achang_pt-post-item a:hover {
    text-decoration: underline;
    color: #0073aa;
}