*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    /* Default Dark Mode Aesthetics */
    --td-bg: #1b1b1b;
    --td-text: #e1e1e1;
    --td-primary: #0078d4;
    --td-secondary: #2d2d2d;
    --td-border: #444444;
    --td-meta: #a19f9d;
    --td-tag-bg: #2b3a4a;
    --td-tag-text: #479ef5;
    --td-vote-active: #ff8c00;
    --td-btn-hover: #0086f0;
    /* v0.2.17: Lighter blue for better hover feedback */
    --td-card-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.td-forum-container.dark-mode {
    --td-bg: #1b1b1b;
    --td-text: #e1e1e1;
    --td-secondary: #2d2d2d;
    --td-border: #444444;
    --td-meta: #a19f9d;
    --td-tag-bg: #2b3a4a;
    --td-tag-text: #479ef5;
    --td-card-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Hide theme footer elements specifically when forum is present */
.td-forum-container~footer,
footer.wp-block-template-part,
.site-footer {
    display: none !important;
}

/* Ensure the body and theme wrappers don't add extra space */
body:has(.td-forum-container),
.td-forum-container {
    background-color: #1b1b1b !important;
}

/* Aggressively remove theme content spacing on forum pages */
.td-forum-container,
.entry-content:has(.td-forum-container),
.post-content:has(.td-forum-container),
.page-content:has(.td-forum-container),
article:has(.td-forum-container) {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
}

.td-forum-container {
    font-family: var(--td-font-family, 'Segoe UI', system-ui, -apple-system, sans-serif);
    font-size: var(--td-font-size-global, 14px);
    font-weight: var(--td-font-weight-global, normal);
    font-style: var(--td-font-style-global, normal);
    color: var(--td-text);
    background: var(--td-bg);
    max-width: 1200px;
    margin: 0 auto 20px auto;
    padding: 0 20px 20px 20px;
}


/* Post Card */
/* Hide theme headers/titles on forum pages */
header.entry-header,
h1.entry-title,
.entry-header h1,
.wp-block-post-title,
.page-header,
.entry-title {
    display: none !important;
}

.td-post-card {
    display: flex;
    background: var(--td-secondary);
    border: 1px solid var(--td-border);
    border-radius: 4px;
    margin-bottom: 15px;
    padding: 20px;
    box-shadow: var(--td-card-shadow);
    transition: background-color 0.2s, border-color 0.2s;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    max-height: 258.8px;
}

.td-post-card:hover {
    border-color: var(--td-primary);
    background-color: #353535;
}

.td-post-excerpt {
    font-size: 13px;
    color: var(--td-meta);
    margin-bottom: 12px;
    line-height: 1.4;
    word-break: break-all;
    overflow-wrap: break-word;
}

/* --- SINGLE POST REFINEMENTS --- */

/* --- SINGLE POST REFINEMENTS --- */

/* --- GLOBAL TYPOGRAPHY --- */
* {
    font-family: var(--td-font-family, Consolas, Monaco, monospace) !important;
}

/* Header Layout & Padding (v0.2.70) */
header.wp-block-group {
    padding: 20px 100px !important;
    width: 100% !important;
}

/* Header Logo Link (v0.2.65) */
.td-logo-link {
    display: inline-flex;
    align-items: center;
    transition: opacity 0.2s;
}

.td-logo-link:hover {
    opacity: 0.8;
}

.td-logo-img {
    height: 24px;
    /* Small icon size */
    width: auto;
    display: block;
}

/* --- SINGLE POST REFINEMENTS --- */

/* Surgical Hide for Block Theme (TT5) Blocks ONLY */
.single-td_forum_post .wp-block-post-title,
.single-td_forum_post .wp-block-post-date,
.single-td_forum_post .wp-block-post-author,
.single-td_forum_post .wp-block-post-featured-image,
.single-td_forum_post .wp-block-post-navigation,
.single-td_forum_post .wp-block-comments-query-loop,
.single-td_forum_post .wp-block-query-no-results,
.single-td_forum_post .wp-block-post-navigation-link {
    display: none !important;
}

/* Ensure our container and the core content block are visible */
.single-td_forum_post .wp-block-post-content,
.single-td_forum_post .entry-content,
.single-td_forum_post .post-content,
.td-forum-container.single-post {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 30px auto !important;
    padding-top: 0 !important;
    max-width: 1200px !important;
}

/* 1. Title (Doubled from 20 to 40) */
.td-single-top-flex {
    display: flex;
    gap: 30px;
    align-items: flex-start;
    margin-bottom: 20px;
}

.td-single-header-main {
    flex-grow: 1;
    min-width: 0;
    /* Important for ellipsis */
}

.td-single-title {
    font-size: calc(var(--td-font-size-post-title, 20px) * 2) !important;
    font-weight: var(--td-font-weight-post-title, 700) !important;
    font-style: var(--td-font-style-post-title, normal) !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.1;
    word-break: break-word;
    /* Allow wrapping */
    overflow-wrap: break-word;
    /* Removed white-space: nowrap to allow wrapping on small screens/long words */
}

/* 2. Tag & Meta Row */
.td-post-meta-line {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 0px;
}

.td-tag-btn {
    display: inline-block;
    padding: 3px 12px;
    background: var(--td-primary);
    color: white !important;
    font-size: 10px;
    border-radius: 4px;
    text-decoration: none !important;
}

.td-post-author-info {
    font-size: var(--td-font-size-post-meta, 18px) !important;
    font-weight: var(--td-font-weight-post-meta, normal) !important;
    font-style: var(--td-font-style-post-meta, normal) !important;
    color: #888;
}

.td-post-author-name {
    font-size: inherit !important;
    font-weight: 700;
}

/* 3. Narrow Section (70% standard, 40% for Create) */
.td-post-narrow-section {
    max-width: 70% !important;
    margin: 0 auto !important;
}

.td-create-post-container {
    max-width: 32% !important;
    margin: 0 auto !important;
}

.td-divider {
    border: 0;
    border-top: 1px solid #333;
    margin: 15px 0;
}

/* 4. Centered Image (700x400) */
.td-single-featured-image {
    display: flex;
    justify-content: center;
    margin-bottom: 25px;
}

.td-post-image-main {
    width: 700px !important;
    height: 400px !important;
    object-fit: cover !important;
    border-radius: 8px;
}

.td-auth-box h2 {
    margin-top: 0;
    margin-bottom: 20px;
}

.td-alert {
    padding: 12px;
    border-radius: 4px;
    margin-bottom: 20px;
    font-size: 14px;
}

.td-alert-error {
    background: #442222;
    border: 1px solid #ff5555;
    color: #ffaaaa;
}

.td-alert-success {
    background: #1b2e1b;
    border: 1px solid #4CAF50;
    color: #a5d6a7;
}

/* Dynamic Auth Button */
.td-auth-btn {
    text-decoration: none;
    color: white;
    font-family: Consolas, Monaco, monospace;
    font-weight: 700;
    font-size: 16px;
    padding: 8px 16px;
    background: var(--td-secondary);
    border: 1px solid var(--td-border);
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    transition: all 0.2s;
}

.td-auth-btn:hover {
    background: var(--td-primary);
    border-color: var(--td-primary);
}

.td-auth-btn .td-logout-text {
    display: none;
}

.td-auth-btn.logged-in:hover .td-user-name {
    display: none;
}

.td-auth-btn.logged-in:hover .td-logout-text {
    display: inline;
}

/* (v0.2.0) Pinned Posts */
.td-post-card.pinned {
    background: rgba(0, 120, 212, 0.1);
    border-left: 3px solid var(--td-primary);
    position: relative;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

/* (v0.2.1) Notifications & ACtions */
.td-user-controls {
    display: flex;
    align-items: center;
    gap: 15px;
}

.td-notification-wrapper {
    position: relative;
}

.td-notification-bell {
    background: transparent;
    border: none;
    font-size: 20px;
    line-height: 1;
    /* (v0.2.46) Fix vertical alignment */
    cursor: pointer;
    position: relative;
    padding: 5px;
    transition: transform 0.2s;
}

.td-notification-bell:hover {
    transform: scale(1.1);
}

.td-notification-dot {
    position: absolute;
    top: 6px;
    /* (v0.2.46) Lowered from 5px */
    right: 4px;
    /* (v0.2.46) Adjusted from 5px */
    width: 8px;
    height: 8px;
    background: red;
    border-radius: 50%;
    border: 1px solid var(--td-bg);
}

.td-notification-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    width: 300px;
    background: var(--td-surface);
    border: 1px solid var(--td-border);
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
    z-index: 1000;
    margin-top: 10px;
    overflow: hidden;
}

.td-notification-header {
    padding: 10px 15px;
    border-bottom: 1px solid var(--td-border);
    font-weight: 700;
    font-size: 13px;
    background: rgba(255, 255, 255, 0.05);
}

.td-notification-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 300px;
    overflow-y: auto;
}

.td-notification-list li {
    padding: 12px 15px;
    border-bottom: 1px solid #333;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.2s;
}

.td-notification-list li:hover {
    background: rgba(255, 255, 255, 0.05);
}

.td-notification-list li.unread {
    background: rgba(0, 120, 212, 0.1);
    border-left: 2px solid var(--td-primary);
}

.td-no-notifs {
    text-align: center;
    color: var(--td-meta);
    font-style: italic;
    padding: 20px !important;
}

/* Action Buttons */
.td-action-btn {
    background: transparent;
    border: none;
    color: var(--td-meta);
    cursor: pointer;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0;
    transition: color 0.2s;
}

.td-action-btn:hover {
    color: var(--td-text);
}

.td-follow-btn.active {
    color: var(--td-primary);
    /* Blue */
}

/* Share Bubble */
.td-share-btn {
    position: relative;
}

.td-share-bubble {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    white-space: nowrap;
    margin-bottom: 5px;
    pointer-events: none;
}

.td-pinned-badge {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 10px;
    font-weight: 700;
    color: var(--td-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid var(--td-primary);
    padding: 2px 6px;
    border-radius: 4px;
}

.td-global-pin-btn {
    background: transparent;
    border: none;
    color: var(--td-meta);
    font-size: 11px;
    cursor: pointer;
    margin-left: 10px;
    text-decoration: underline;
}

.td-global-pin-btn:hover {
    color: var(--td-primary);
}

.td-global-pin-btn.active {
    color: #e74c3c;
    /* Red for Unpin */
}

/* Pin Comment Button (Absolute Top Right of Comment) */
.td-pin-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    color: var(--td-primary);
    z-index: 10;
}

.td-pin-btn:hover {
    text-decoration: underline;
}

/* 4. Post Meta & Vote (v0.0.98 fix) */
.td-post-meta {
    font-size: 14px !important;
    line-height: 1.4;
    margin-bottom: 30px;
}

/* 5. Description (Size 14) */
.td-post-body {
    font-size: var(--td-font-size-post, 14px) !important;
    font-weight: var(--td-font-weight-post, normal) !important;
    font-style: var(--td-font-style-post, normal) !important;
    line-height: 1.4;
    margin-bottom: 30px;
    word-break: break-word;
    overflow-wrap: break-word;
}

.td-post-body p {
    margin: 8px 0 !important;
}

/* 6. Expandable Attachments */
.td-section-toggle {
    background: none;
    border: none;
    color: var(--td-primary);
    font-size: 12px;
    padding: 0;
    cursor: pointer;
    margin-bottom: 10px;
}

.td-collapsed {
    display: none !important;
}

/* 7. Comments Overhaul */
.td-comments-section {
    margin-top: 30px;
}

/* Response Title (Size 10) */
.comments-title,
.wp-block-comments-title {
    font-size: var(--td-font-size-comment-title, 10px) !important;
    font-weight: var(--td-font-weight-comment-title, normal) !important;
    font-style: var(--td-font-style-comment-title, normal) !important;
    margin-bottom: 15px !important;
}

/* Hide avatars */
.comment-author .avatar {
    display: none !important;
}

.comment-author cite,
.comment-author .fn,
.wp-block-comment-author-name {
    font-size: var(--td-font-size-comment-author, 14px) !important;
    font-weight: var(--td-font-weight-comment-author, 700) !important;
    font-style: var(--td-font-style-comment-author, normal) !important;
}

/* (v0.2.81) Sidebar Style Comments */
.comment-body {
    display: flex !important;
    flex-direction: row !important;
    gap: 25px !important;
    align-items: center !important;
    /* Vertical centering */
}

.td-comment-sidebar {
    flex: 0 0 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 8px;
}

.td-comment-author-name {
    font-weight: 700;
    color: var(--td-text);
    font-size: 13px;
    word-break: break-word;
    width: 100%;
    /* Ensure centering works across full sidebar width */
}

.td-comment-main-content {
    flex: 1;
    min-width: 0;
}

.td-user-reputation {
    background: rgba(0, 120, 212, 0.1);
    color: var(--td-primary) !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--td-primary);
}

/* (v0.2.89) Edit Form Enhancements */
.td-label-with-clear {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.td-clear-btn {
    background: none;
    border: none;
    color: #ff5555;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    padding: 0;
}

.td-clear-btn:hover {
    text-decoration: underline;
}

.td-drop-zone.cleared {
    border-color: var(--td-border) !important;
    background: transparent !important;
}

/* Comment Delete Link */
.td-comment-delete-btn {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    margin-left: 10px;
}

/* Comment text (Size 14) */
.comment-content p {
    font-size: var(--td-font-size-comment-content, 14px) !important;
    font-weight: var(--td-font-weight-comment-content, normal) !important;
    font-style: var(--td-font-style-comment-content, normal) !important;
    line-height: 1.4 !important;
    margin: 8px 0 !important;
    word-break: break-word;
    overflow-wrap: break-word;
}

/* Time posted Size 10 (Non-clickable) */
.wp-block-comment-date,
.wp-block-comment-date a,
.wp-block-comment-date time {
    font-size: var(--td-font-size-comment-date, 10px) !important;
    color: #888 !important;
    pointer-events: none !important;
    text-decoration: none !important;
    cursor: default !important;
}

/* Horizontal Layout for Manual Loop Comments */
li.comment {
    display: block !important;
    position: relative !important;
    padding: 25px 0 !important;
    list-style: none !important;
    border-bottom: 1px solid #333 !important;
}

/* Gray Comment Box - Smaller width to prevent sticking out */
#respond {
    background: #222;
    padding: 10px 20px;
    border-radius: 8px;
    margin: 15px auto 0 !important;
    max-width: 95%;
    text-align: center;
}

#commentform textarea,
.td-t#commentform textarea {
    background: #2d2d2d !important;
    border: 1px solid #444 !important;
    color: #eee !important;
    font-size: 14px !important;
    padding: 15px !important;
    width: 100% !important;
    margin: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
    height: 120px !important;
}

/* Hide Reply and other clutter */
.reply,
.comment-reply-link,
.logged-in-as,
.comment-notes,
.comment-form-label,
label[for="comment"] {
    display: none !important;
}

/* Fix theme padding issues without hiding blocks */
.single-td_forum_post .wp-block-group.alignfull.has-global-padding {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Forum Layout - 70/30 Split */
.td-forum-layout {
    display: flex;
    flex-direction: row;
    gap: 30px;
    align-items: flex-start;
}

.td-post-list-main {
    flex: 0 0 70%;
    min-width: 0;
}

.td-forum-sidebar {
    flex: 0 0 30%;
    min-width: 0;
}

.td-section-header {
    margin-bottom: 20px;
    display: flex;
    justify-content: flex-end;
    /* Sorting at the top right of post section */
}

.td-sidebar-action {
    margin-bottom: 25px;
}

.td-btn.full-width {
    display: block;
    width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center;
}

.td-btn {
    text-decoration: none !important;
}

/* Post Card Layout Fix for Thumbnail */
.td-post-card {
    display: flex;
    gap: 20px;
    align-items: center;
    /* Vertically centered thumb */
    margin-bottom: 20px;
    margin-bottom: 15px;
}

.td-tag {
    font-size: 11px;
    padding: 4px 8px;
    background: var(--td-tag-bg);
    color: var(--td-tag-text);
    border-radius: 2px;
    font-weight: 500;
}

.td-post-footer {
    display: flex;
    gap: 20px;
    font-size: 13px;
    color: var(--td-meta);
}

.td-footer-item {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.td-footer-item:hover {
    color: var(--td-primary);
}

/* Sidebar */
/* Grid removed in favor of flex 70/30 above */

.td-sidebar-widget {
    background: var(--td-secondary);
    padding: 20px;
    border-radius: 4px;
}

.td-widget-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--td-border);
    padding-bottom: 10px;
}

.td-cat-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.td-cat-item {
    margin-bottom: 10px;
    display: block;
    font-size: 14px;
}

.td-cat-item a {
    text-decoration: none !important;
    color: var(--td-text);
    transition: color 0.2s;
}

.td-cat-item a:hover,
.td-cat-item.active a {
    color: var(--td-primary);
}

/* Form Styling */
.td-form-group {
    margin-bottom: 20px;
}

.td-form-label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
}

.td-input {
    width: 100%;
    padding: 10px;
    border: 1px solid var(--td-border);
    border-radius: 4px;
    background: var(--td-bg) !important;
    color: var(--td-text) !important;
}

/* (v0.2.68) Prevent browser autofill from turning inputs white */
.td-input:-webkit-autofill,
.td-input:-webkit-autofill:hover,
.td-input:-webkit-autofill:focus,
.td-input:-webkit-autofill:active {
    -webkit-text-fill-color: var(--td-text) !important;
    -webkit-box-shadow: 0 0 0px 1000px var(--td-bg) inset !important;
    transition: background-color 5000s ease-in-out 0s;
}

.td-btn {
    padding: 10px 20px;
    background: var(--td-primary);
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 120px;
    text-align: center;
}

/* (v0.2.54) Sort UI Refinements */
.td-sort-wrapper {
    display: flex;
    gap: 10px;
    align-items: center;
}

.td-sort-select {
    width: auto !important;
    min-width: 180px;
    padding: 8px 12px;
}

.td-btn-icon {
    min-width: 40px !important;
    padding: 0 10px !important;
    height: 38px;
    font-size: 14px;
}

.td-form-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-start;
    margin-top: 30px;
}

/* Single Post Specific */
.td-post-meta-top {
    font-size: 12px;
    color: var(--td-meta);
    margin-bottom: 20px;
}

.td-post-body {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 25px;
}

.td-attachment-img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    border: 1px solid var(--td-border);
    margin: 10px 0;
}

.td-post-actions-bar {
    display: flex;
    align-items: center;
    gap: 25px;
    padding: 15px 0;
    border-top: 1px solid var(--td-border);
    border-bottom: 1px solid var(--td-border);
    margin: 20px 0;
}

/* (v0.2.21) Action Buttons in Single Post View */
.td-post-actions {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 25px 0;
    padding: 20px 0;
    border-top: 1px solid var(--td-border);
    border-bottom: 1px solid var(--td-border);
}

.td-post-actions .td-action-btn {
    padding: 8px 16px;
    /* v0.2.23: Reduced from 10px 20px */
    background: var(--td-secondary);
    color: var(--td-text);
    border: 1px solid var(--td-border);
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
    /* v0.2.23: Reduced from 14px */
    display: inline-flex;
    align-items: center;
    gap: 6px;
    /* v0.2.23: Reduced from 8px */
    transition: all 0.2s;
}

.td-post-actions .td-action-btn:hover {
    background: var(--td-primary);
    color: white;
    border-color: var(--td-primary);
}

.td-post-actions .td-follow-btn.active {
    background: var(--td-primary);
    color: white;
    border-color: var(--td-primary);
}

/* (v0.2.23) Share Confirmation Bubble */
.td-share-bubble {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--td-primary);
    color: white;
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.td-share-bubble.show {
    opacity: 1;
}

.td-vote-section.horizontal {
    flex-direction: row;
    gap: 10px;
    margin-right: 0;
}

.td-divider {
    border: 0;
    border-top: 1px solid var(--td-border);
    margin: 30px 0;
}

/* Comments */
#reply-title {
    font-size: 18px;
    font-weight: 600;
}

#commentform textarea {
    width: 100%;
    background: var(--td-bg);
    color: var(--td-text);
    border: 1px solid var(--td-border);
    padding: 15px;
}

.td-btn:hover {
    background: var(--td-btn-hover);
    color: white;
}

.td-btn:disabled,
.td-btn[disabled] {
    background-color: #555 !important;
    color: #999 !important;
    border-color: #555 !important;
    cursor: not-allowed;
    opacity: 0.7;
}

/* (v0.2.33) Notification Dropdown - Remove Transparency */
.td-notification-dropdown {
    display: none;
    position: absolute;
    top: 40px;
    right: 0;
    width: 300px;
    background: #1e1e1e;
    /* Solid Dark Background */
    border: 1px solid var(--td-border);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    z-index: 1000;
    overflow: hidden;
}

.td-notification-list {
    max-height: 300px;
    overflow-y: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}

.td-notification-item {
    display: block;
    padding: 12px 15px;
    border-bottom: 1px solid #333;
    color: var(--td-text);
    text-decoration: none;
    font-size: 13px;
    transition: background 0.2s;
}

.td-notification-item:hover {
    background: #2a2a2a;
    color: var(--td-primary);
}

.td-notification-item.unread {
    background: rgba(0, 120, 212, 0.1);
    border-left: 3px solid var(--td-primary);
}

.td-notification-empty {
    padding: 20px;
    text-align: center;
    color: #888;
    font-style: italic;
}

.td-btn-secondary {
    background: transparent;
    border: 1px solid var(--td-border);
    color: var(--td-text);
}

/* Password Toggle (v0.0.98) */
.td-password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 20px;
    color: var(--td-meta);
    opacity: 0.7;
    transition: opacity 0.2s;
    user-select: none;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.td-password-toggle:hover {
    opacity: 1;
    color: var(--td-primary);
}

.td-password-input {
    padding-right: 40px !important;
    /* Make room for icon */
}

/* 10. Tag Category Select (v0.0.79/v0.0.86 restore) */
.td-category-tags {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

/* 11. Top Right User Button (v0.0.99) */
.td-auth-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    /* Fixed width */
    height: 36px;
    /* Fixed height */
    padding: 0;
    /* Reset padding */
    background: var(--td-surface);
    color: var(--td-text);
    border: 1px solid var(--td-border);
    border-radius: 4px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.2s ease;
    box-sizing: border-box;
    /* Include border in size */
}

.td-auth-btn:hover {
    background: var(--td-primary);
    color: #000;
    border-color: var(--td-primary);
    text-decoration: none;
}

/* Logged In State */
.td-auth-btn.logged-in {
    background: transparent;
    border-color: var(--td-border);
}

.td-auth-btn.logged-in:hover {
    background: #e74c3c;
    /* Red for logout */
    border-color: #e74c3c;
    color: white;
}

.td-auth-btn.logged-in .td-user-name {
    display: block;
}

.td-auth-btn.logged-in:hover .td-user-name {
    display: none;
}

.td-auth-btn.logged-in:hover::after {
    content: attr(data-text);
    display: block;
}

.td-tag-selector {
    background: #333;
    color: #eee;
    border: 1px solid #444;
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.td-tag-selector:hover {
    background: #444;
}

.td-tag-selector.selected {
    background: var(--td-primary);
    border-color: var(--td-primary);
    color: white;
}

/* 11. Square Drop Zones (v0.0.80/v0.0.88 restore) */
.td-drop-grid {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.td-drop-grid .td-form-group {
    flex: 1;
    margin-top: 0;
}

.td-drop-zone {
    border: 2px dashed #444;
    border-radius: 8px;
    background: #252525;
    padding: 10px;
    text-align: center;
    transition: all 0.2s;
    cursor: pointer;
    position: relative;
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 140px;
    /* Reduced from 200px */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.td-drop-zone.drag-valid {
    border-color: var(--td-primary);
    background: rgba(0, 120, 212, 0.15);
}

.td-drop-zone.drag-invalid {
    border-color: #ff5555;
    background: rgba(255, 85, 85, 0.15);
}

.td-drop-text {
    font-size: 13px;
    color: #888;
    pointer-events: none;
    line-height: 1.4;
}

.td-drop-zone.has-file .td-drop-text {
    color: var(--td-primary);
    font-weight: 700;
}

.td-error-msg {
    color: #ff5555;
    font-size: 10px;
    margin-top: 5px;
    min-height: 15px;
}

/* 12. Auth Screen Styles (v0.0.68/v0.0.86 restore) */
.td-auth-box {
    background: var(--td-secondary);
    padding: 30px;
    border-radius: 8px;
    box-shadow: var(--td-card-shadow);
    margin: 40px auto;
    max-width: 400px;
    width: 100%;
}

.td-auth-box h2 {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 24px;
    text-align: center;
}

.td-alert {
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 15px;
    font-size: 13px;
}

.td-alert-error {
    background: rgba(255, 85, 85, 0.1);
    border: 1px solid #ff5555;
    color: #ff5555;
}

.td-auth-box .td-btn {
    width: 100%;
    margin-top: 10px;
}

/* 13. Pinned Comments (v0.0.75/v0.0.86 restore) */
.td-pinned-comment-block {
    background: rgba(0, 50, 100, 0.1);
    border: 1px solid #0056b3;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 25px;
}

.td-pinned-label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: var(--td-primary);
    margin-bottom: 5px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* 14. Disabled States (v0.0.84 restore) */
.td-btn:disabled {
    background: #2a2a2a !important;
    border-color: #333 !important;
    color: #555 !important;
    cursor: not-allowed;
    opacity: 0.7;
}

/* Voting Component - Restored */
.td-vote-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    min-width: 60px;
    text-align: center;
}

.td-vote-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 24px;
    color: var(--td-meta);
    transition: color 0.2s;
    padding: 0;
    margin: 0 auto;
    width: 100%;
    display: block;
    line-height: 1;
}

.td-vote-btn:hover,
.td-vote-btn.active {
    color: var(--td-vote-active);
}

/* Attachment Section (Restored) */
/* Attachment Section (Restored & Simplified v0.2.47) */
.td-attachments-wrapper {
    margin: 15px 0;
}

.td-attachment-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.td-attachment-item {
    display: inline-block;
    padding: 8px 12px;
    background: var(--td-secondary);
    border: 1px solid var(--td-border);
    border-radius: 4px;
    margin-right: 10px;
    margin-bottom: 10px;
    text-decoration: none;
    color: var(--td-text);
    font-size: 13px;
    transition: background-color 0.2s;
}

.td-attachment-item:hover {
    background-color: #3d3d3d;
    border-color: var(--td-primary);
}


/* Password Toggle Text Style (v0.2.68) */
.td-password-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    color: var(--td-primary);
    text-transform: uppercase;
    user-select: none;
    z-index: 5;
}

.td-password-toggle:hover {
    color: var(--td-btn-hover);
}

/* (v0.2.93) Registration Validation */
.td-reg-status {
    margin-left: 5px;
    font-weight: bold;
    display: inline-block;
    transition: opacity 0.2s;
}

.td-reg-status.invalid {
    color: #ff5555;
    animation: td-blink 0.5s step-end 3;
}

.td-reg-status.valid {
    color: #50fa7b;
}

.td-reg-msg {
    font-size: 12px;
    color: #ff5555;
    margin-top: 4px;
    min-height: 15px;
}

.td-input.invalid {
    border-color: #ff5555 !important;
}

/* (v0.3.08) Restricted Content Error Management */
.td-restricted-error {
    color: #ff5555;
    font-size: 13px;
    font-weight: 700;
    margin-top: 8px;
    display: block;
    text-align: left;
}

/* (v0.3.11) Prevents layout shift/button resizing when error is shown */
.td-form-actions {
    position: relative;
    padding-bottom: 25px;
    /* Reserve space for error below */
}

#td-post-restricted-error {
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0;
}

#commentform .td-restricted-error {
    margin-top: 10px;
}

@keyframes td-blink {
    50% {
        opacity: 0;
    }
}