/* Base styling for thread_status */
.thread_status {
    display: inline-flex; /* Flexbox for alignment */
    justify-content: center; /* Center content horizontally */
    align-items: center; /* Center content vertically */
    width: 40px; /* Container size */
    height: 40px;
    border: 1px solid var(--color-main); /* Default border */
    position: relative; /* For ::before positioning */
    box-sizing: border-box;
}

/* Font Awesome Pro icons for each type */
.thread_status::before {
    font-family: var(--fa-icon-font); /* Font Awesome Pro */
    position: absolute;
    content: ""; /* Default content is empty */
    font-size: 20px; /* Icon size */
    font-weight: 400; /* Regular weight */
}

/* New threads: Ensure green border */
.thread_status.newfolder,
.thread_status.newhotfolder,
.thread_status.newhotclosefolder,
.thread_status.newclosefolder {
    border-color: var(--color-accent1); /* Green border for all new threads */
}

.thread_status.newfolder::before {
    content: "\f70e"; /* Font Awesome Pro: fa-circle-plus */
    color: var(--color-accent1); /* Accent color */
    width: 100%; /* Take up the parent's full width */
    height: 100%; /* Take up the parent's full height */
    display: flex; /* Ensure the icon itself is a flex container */
    justify-content: center; /* Center the icon horizontally */
    align-items: center; /* Center the icon vertically */
    box-sizing: border-box; /* Ensure padding/borders are accounted for */
}

/* New posts */
.thread_status.newhotfolder::before {
    content: "\f06d"; /* Font Awesome Pro: fa-fire */
    color: var(--color-accent1); /* Accent color */
}

.thread_status.newhotclosefolder::before,
.thread_status.newclosefolder::before {
    content: "\f023"; /* Font Awesome Pro: fa-lock */
    color: var(--color-accent1); /* Accent color for locked threads */
}

/* Old posts */
.thread_status.folder::before {
    content: "\f70e"; /* Font Awesome Pro: fa-file */
    color: var(--color-main); /* Main color for old posts */
}

.thread_status.hotfolder::before {
    content: "\f06d"; /* Font Awesome Pro: fa-fire */
    color: var(--color-main); /* Main color */
}

.thread_status.hotclosefolder::before,
.thread_status.closefolder::before {
    content: "\f023"; /* Font Awesome Pro: fa-lock */
    color: var(--color-secondary); /* Secondary color for locked threads */
}

/* Threads with user posts */
.thread_status.dot_folder::before {
    content: "\f007"; /* Font Awesome Pro: fa-user */
    color: var(--color-accent1); /* Highlight for user posts */
}

.thread_status.dot_newfolder::before {
    content: "\f055"; /* Font Awesome Pro: fa-circle-plus */
    color: var(--color-accent1); /* Accent for new posts by user */
}

.thread_status.dot_hotfolder::before {
    content: "\f06d"; /* Font Awesome Pro: fa-fire */
    color: var(--color-accent1); /* Alternate accent */
}

.thread_status.dot_hotclosefolder::before {
    content: "\f023"; /* Font Awesome Pro: fa-lock */
    color: var(--color-accent1); /* Secondary color */
}