forum-header {
	display: block;
}
forum-header h1 {
	font-size: 18px;
}
forum-header p {
	margin-top: 8px;
	font-size: 13.5px;
}
forum-path {
	display: block;
	margin-bottom: 12px;
	font-size: 13.5px;
}
forum-toolbar {
	display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 12px;
    gap: 12px;
    flex-wrap: wrap;
}
forum-grid {
    display: flex;
    flex-direction: column;
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
	font-size: 13.5px;
}
forum-row {
    display: grid;
	grid-template-columns: repeat(auto-fit, minmax(0px, 1fr));
    border-bottom: 1px solid var(--color-border);
    background-color: var(--color-surface);
}
forum-grid.boards forum-row {
    grid-template-columns: 2fr 1fr 1fr 2fr;
}
forum-grid.threads.admin forum-row {
    grid-template-columns: 3fr 1fr 2fr 80px;
}
forum-grid.threads forum-row {
    grid-template-columns: 3fr 1fr 2fr;
}
forum-grid.posts forum-row {
	grid-template-columns: 150px 1fr 80px;
}
forum-row:last-child {
    border-bottom: none;
}
forum-row.header {
    background-color: var(--color-surface-elevated);

    border-bottom: 2px solid var(--color-border);
}
forum-row.header forum-cell {
    font-weight: 600;
	font-size: 11.5px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
    color: var(--color-text-secondary);
}
forum-row[board-id]:hover, forum-row[thread-id]:hover {
	background-color: var(--color-surface-hover);
}
forum-cell {
    padding: 12px;
    color: var(--color-text);
}
forum-cell input[type=checkbox] {
	margin-top: -5.5px;
	margin-bottom: -5.5px;
	margin-left: auto;
	margin-right: auto;
}
forum-cell.center {
    text-align: center;
}
forum-cell.post-body {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto 1fr; 
	grid-template-areas: 
		"left-box	right-box"
		"bottom-box	bottom-box"
	;
}
forum-post-avatar {
	display: block;
	width: 88px;
    height: 88px;
    border-radius: 50%;
    background-color: var(--color-secondary);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    color: var(--color-secondary-light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 28px;
    letter-spacing: -.02em;
    border: 4px solid var(--color-secondary);
    box-shadow: var(--shadow-md);
    transition: border-color .22s ease;
}
forum-post-avatar.image {
	color: transparent;
}
forum-post-usernm {
	display: block;
	margin-top: 8px;
}
forum-post-name {
	grid-area: left-box;
	display: flex;
	align-items: center;      		/* Vertically middle */
	justify-content: flex-start; 	/* Horizontally left */
	font-weight: bold;
}
forum-post-date {
	grid-area: right-box;
	display: flex;
	align-items: center;      		/* Vertically middle */
	justify-content: flex-end;   	/* Horizontally right */
}
forum-post-body {
	grid-area: bottom-box;
	text-align: left; 
  	padding-top: 12px; 
}
forum-toolbar button {
	background-color: var(--color-primary);
    color: var(--c-ink-soft);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: 8px 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: var(--radius-md);
    font-weight: 600;
    transition: transform .1s ease, box-shadow .15s ease, opacity .15s ease;
}
forum-toolbar button:hover {
    box-shadow: var(--shadow-sm);
    background-color: var(--color-primary-hover); 
}
forum-toolbar .window-control {
	padding: 8px 14px;
}
.thread-option {
	display: flex;
	align-items: center;
	justify-content: left;
	width: 100%;
	padding: 8px 10px;
	border-radius: var(--radius-sm);
	font-size: 13.5px;
	color: var(--color-text);
	text-align: left;
	transition: background .1s ease;
	background-color: var(--color-surface);
}
.thread-option:hover {
	background: var(--color-surface-elevated);
}
.thread-option[action]::before {
	content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: -2px;
    margin-right: 6px;
    text-align: center;
    vertical-align: middle;
    background-color: currentColor;
}
.thread-option[action="pin"]::before {
	-webkit-mask: var(--icon-pin) center / contain no-repeat;
          	mask: var(--icon-pin) center / contain no-repeat;
}
.thread-option[action="unpin"]::before {
	-webkit-mask: var(--icon-unpin) center / contain no-repeat;
          	mask: var(--icon-unpin) center / contain no-repeat;
}
.thread-option[action="lock"]::before {
	-webkit-mask: var(--icon-lock) center / contain no-repeat;
          	mask: var(--icon-lock) center / contain no-repeat;
}
.thread-option[action="unlock"]::before {
	-webkit-mask: var(--icon-unlock) center / contain no-repeat;
          	mask: var(--icon-unlock) center / contain no-repeat;
}
.thread-option[action="move"]::before {
	-webkit-mask: var(--icon-move) center / contain no-repeat;
          	mask: var(--icon-move) center / contain no-repeat;
}
forum-row icon {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-right: 3px;
	text-align: center;
	vertical-align: middle;
	background-color: currentColor;
}
forum-row icon.lock {
	-webkit-mask: var(--icon-lock) center / contain no-repeat;
          	mask: var(--icon-lock) center / contain no-repeat;
}
forum-row icon.pin {
	-webkit-mask: var(--icon-pin) center / contain no-repeat;
          	mask: var(--icon-pin) center / contain no-repeat;
}
forum-cell.action {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
forum-cell.action button {
    background-color: var(--color-primary);
    color: var(--c-ink-soft);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
    height: 34px;
    width: 34px;
    border-radius: var(--radius-md);
    font-weight: 600;
    transition: transform .1s ease, box-shadow .15s ease, opacity .15s ease;
}
forum-cell.action button:hover {
	background-color: var(--color-primary-hover);
}
forum-cell.action button::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    text-align: center;
    vertical-align: middle;
    background-color: currentColor;
}
forum-cell.action button.post-update::before {
	-webkit-mask: var(--icon-edit) center / contain no-repeat;
          	mask: var(--icon-edit) center / contain no-repeat;
}
forum-cell.action button.post-delete::before {
	-webkit-mask: var(--icon-delete) center / contain no-repeat;
          	mask: var(--icon-delete) center / contain no-repeat;
}

@media (max-width: 768px) {
    forum-row {
        grid-template-columns: 1fr;
        padding: 1rem 0;
    }
    forum-row.header {
        display: none;
    }
    forum-cell {
        padding: 0.25rem 1rem; 
    }
    forum-cell.center {
        text-align: left;
        color: #64748b; /* Soften text color for minor stats */
        font-size: 0.875rem;
    }
}