/*
Theme Name: XenWord Theme
Description: Professional WP theme for XenForo integration. Modern, responsive, always-correct sidebar layout.
Version: 1.0.1
Author: XenWord Team
*/

/* === RESET & PALETTE === */
html, body {
    margin: 0;
    padding: 0;
    background: var(--xf-paletteNeutral1, #f8f9fa);
    color: var(--xf-textColor, #222);
    font-family: var(--xf-fontFamily, -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif);
    font-size: 16px;
    box-sizing: border-box;
    line-height: 1.7;
}
*, *:before, *:after { box-sizing: inherit; }
img { max-width: 100%; height: auto; display: block; }

/* === LABEL STYLES === */
.label {
    display: inline-block;
    padding: 1px .35em;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 80%;
    line-height: 1.26;
    text-decoration: none;
    background-color: red;
    color: white;
}

a { color: var(--xf-linkColor, #2196f3); text-decoration: none; transition: color 0.18s; }
a:hover, a:focus { color: var(--xf-linkHoverColor, #1976d2); text-decoration: underline; }

hr { border: 0; border-bottom: 1px solid var(--xf-borderColor, #e0e0e0); margin: 2em 0; }

/* === TYPOGRAPHY === */
h1,h2,h3,h4,h5,h6 { font-weight: 700; color: var(--xf-textColor, #222); margin: 2rem 0 1rem 0; line-height: 1.2; }
h1 { font-size: 2.2rem; } h2 { font-size: 1.7rem; } h3 { font-size: 1.3rem; }
h4 { font-size: 1.1rem; } h5,h6 { font-size: 1rem; }
p, ul, ol, dl, blockquote { margin-bottom: 1.2em; }

.entry-title { color: var(--xf-textColor, #222); margin: 0 0 16px 0; font-size: 2rem; font-weight: 700; }
.entry-meta { color: var(--xf-textColorMuted, #7a7a7a); font-size: 13px; margin-bottom: 15px; }

/* === MAIN LAYOUT === */
.site { min-height: 100vh; display: flex; flex-direction: column; }
.site-content { flex: 1 0 auto; background: inherit; }

.main-wrapper {
    display: flex;
    flex-direction: row;
    gap: 32px;
    max-width: var(--xf-pageWidthMax, 1200px);
    margin: 0 auto;
    padding: 0 24px;
    width: 100%;
}
.content-area {
    flex: 1 1 0;
    min-width: 0;
}
.widget-area, .article-sidebar {
    width: 320px;
    flex-shrink: 0;
    min-width: 0;
    background: transparent;
}
.site-main {
    background: transparent;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    border: none;
}

/* Article rows for post layout - XenForo style */
.article-row--main {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
}
.article-content {
    flex: 1 1 0;
    min-width: 0;
}
.article-sidebar {
    width: 320px;
    flex-shrink: 0;
    margin-left: 0;
}
.article-row--ratings,
.article-row--comments {
    margin-top: 2em;
}
.posts-container { margin: 0; }


/* === SIDEBAR WIDGETS === */
.widget {
    background: var(--xf-contentBg, #fff);
    border: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px);
    margin-bottom: 28px;
    box-shadow: var(--xf-boxShadow, 0 1px 2px rgba(0,0,0,0.06));
}
.widget-title {
    background: var(--xf-paletteNeutral2, #f4f4f4);
    color: var(--xf-textColor, #232629);
    padding: 14px 20px;
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    border-bottom: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px) var(--xf-borderRadius, 3px) 0 0;
}
.widget > *:not(.widget-title) { padding: 16px 20px; }

/* Hide empty WordPress block groups that take up unnecessary space */
.wp-block-group:empty,
.wp-block-group .wp-block-group__inner-container:empty {
    display: none !important;
}

/* Hide block groups that only contain empty inner containers */
.wp-block-group:has(.wp-block-group__inner-container:empty) {
    display: none !important;
}

/* Alternative approach for browsers that don't support :has() */
.wp-block-group .wp-block-group__inner-container {
    min-height: 0;
}

.wp-block-group .wp-block-group__inner-container:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* === HEADER & NAV === */
.xenword-xf-header-wrapper, .xenword-xf-header-integration {
    margin: 0; padding: 0; position: relative; z-index: 100;
}
.xenword-xf-header-wrapper .p-header,
.xenword-xf-header-integration .p-header {
    background: var(--xf-paletteColor1, #2196f3);
    border-bottom: 1px solid var(--xf-borderColor, #1976d2);
}
.xenword-xf-header-wrapper .p-nav,
.xenword-xf-header-integration .p-nav {
    background: var(--xf-paletteColor2, #1976d2);
    border-bottom: 1px solid var(--xf-borderColor, #1565c0);
}

/* === FOOTER === */
.site-footer {
    background: var(--xf-paletteColor2, #1976d2);
    color: #fff; text-align: center; padding: 22px 0; margin-top: 32px;
    border-top: 1px solid var(--xf-borderColor, #1565c0);
}
.site-footer a { color: #fff; text-decoration: underline; }
.site-footer a:hover { color: var(--xf-linkHoverColor, #90caf9); }

/* === RESPONSIVE LAYOUT === */
@media (max-width: 1100px) {
    .main-wrapper { max-width: 98vw; gap: 14px; padding: 0 7px; }
    .widget-area, .article-sidebar { width: 220px; }
}
@media (max-width: 900px) {
    .main-wrapper,
    .article-row--main {
        flex-direction: column !important;
        gap: 0 !important;
        padding: 0 7px;
    }
    .widget-area, .article-sidebar { width: 100%; margin-left: 0; padding-top: 0; }
}
@media (max-width: 600px) {
    .site-main, .widget, .widget-title { padding: 10px !important; font-size: 15px; }
    .entry-title { font-size: 1.25rem; }
}

/* === PRINT === */
@media print {
    .xenword-xf-header-wrapper, .xenword-xf-header-integration, .widget-area,
    .skip-link, .main-navigation, .site-footer, .article-sidebar { display: none !important; }
    .site-main { box-shadow: none; border: none; padding: 0; }
}

/* === XENFORO COMMENT STYLES (kept as is, not duplicated) === */
.comments-area { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--xf-borderColor, #e0e0e0); }
.comments-title { color: var(--xf-textColor, #222); font-size: 1.3rem; margin-bottom: 20px; font-weight: 600; }
.comment-list { list-style: none; padding: 0; margin: 0; }
.comment-list li { margin-bottom: 20px; }

/* XenForo-style comments */
.xenforo-comment {
    border: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px);
    margin-bottom: 15px;
    background: var(--xf-contentBg, #fff);
    box-shadow: var(--xf-boxShadow, 0 1px 2px rgba(0,0,0,0.06));
}
.xenforo-comment-body { padding: 15px; }
.xenforo-author { display: flex; align-items: center; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--xf-borderColor, #e0e0e0); }
.xenforo-avatar { border-radius: 50%; margin-right: 12px; width: 48px; height: 48px; }
.author-info { flex: 1; }
.xenforo-username { font-weight: 600; color: var(--xf-linkColor, #2196f3); text-decoration: none; font-size: 14px; display: block; }
.xenforo-username:hover { color: var(--xf-linkHoverColor, #1976d2); text-decoration: underline; }
.xenforo-post-id, .xenforo-meta { display: block; font-size: 11px; color: var(--xf-textColorMuted, #7a7a7a); margin-top: 2px; margin-bottom: 12px; }
.xenforo-origin-badge { background: var(--xf-paletteColor1, #2196f3); color: white; padding: 2px 6px; border-radius: var(--xf-borderRadius, 3px); font-size: 10px; margin-left: 8px; font-weight: 500; }
.xenforo-content { line-height: 1.6; color: var(--xf-textColor, #222); }
.xenforo-content p { margin-bottom: 12px; }
.xenforo-content p:last-child { margin-bottom: 0; }

/* WordPress comments styling */
.comment-body {
    padding: 15px;
    border: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px);
    background: var(--xf-contentBg, #fff);
    box-shadow: var(--xf-boxShadow, 0 1px 2px rgba(0,0,0,0.06));
}
.comment-author { display: flex; align-items: center; margin-bottom: 10px; }
.comment-author img { border-radius: 50%; margin-right: 10px; }
.comment-meta { font-size: 12px; color: var(--xf-textColorMuted, #7a7a7a); margin-bottom: 10px; }
.comment-content { line-height: 1.6; color: var(--xf-textColor, #222); }
.comment-content p { margin-bottom: 12px; }
.comment-content p:last-child { margin-bottom: 0; }
.reply { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--xf-borderColor, #e0e0e0); }
.comment-reply-link { color: var(--xf-linkColor, #2196f3); text-decoration: none; font-size: 12px; font-weight: 500; }
.comment-reply-link:hover { color: var(--xf-linkHoverColor, #1976d2); text-decoration: underline; }

/* Comment form styling */
.comment-form {
    padding: 10px;
    border: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px);
    background: var(--xf-paletteNeutral1, #f8f9fa);
}
.comment-form-comment textarea {
    width: 100%;
    min-height: 120px;
    padding: 12px;
    border: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
}
.comment-form .submit {
    background: var(--xf-paletteColor1, #2196f3);
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: var(--xf-borderRadius, 3px);
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.2s;
}
.comment-form .submit:hover { background: var(--xf-linkHoverColor, #1976d2); }

/* Comment navigation */
.comment-navigation {
    margin: 20px 0;
    text-align: center;
}
.comment-navigation a {
    color: var(--xf-linkColor, #2196f3);
    text-decoration: none;
    padding: 8px 16px;
    border: 1px solid var(--xf-borderColor, #e0e0e0);
    border-radius: var(--xf-borderRadius, 3px);
    margin: 0 5px;
}
.comment-navigation a:hover {
    background: var(--xf-paletteNeutral1, #f8f9fa);
    text-decoration: none;
}

div.xenword_discuss a {
    display: inline-block;
    float: right;
    background-color: #0078ae;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 8px 20px;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 1.125rem;
    font-weight: normal;
    text-decoration: none;
    text-transform: none;
    box-shadow: none;
    transition: background 0.2s;
    line-height: 1.2;
}

div.xenword_discuss a:hover {
    background-color: #0092d1;
    text-decoration: none;
}

div.xenword_discuss_container {
    margin-bottom: 1em;
    overflow: hidden;
}

span.threadView {
    float: right;
}

.comment-content em { color: var(--xf-textColorMuted, #7a7a7a); font-style: italic; }
.comment-content small { color: var(--xf-textColorMuted, #7a7a7a); font-size: 11px; }

/* === ACCESSIBILITY === */
.skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 999999;
    padding: 8px 16px; background: var(--xf-paletteColor1, #2196f3);
    color: white; text-decoration: none;
}
.skip-link:focus { left: 6px; top: 7px; }

/* XenForo page wrapper positioning - only when admin bar is visible */
.admin-bar .p-pageWrapper {
    top: 30px !important;
}


a.u-concealed {
    color: inherit;
    text-decoration: none;
    opacity: 0.75;
    transition: opacity 0.2s;
    font-size: large;
}
a.u-concealed:hover,
a.u-concealed:focus {
    opacity: 1;
    text-decoration: underline;
}
/* Header account link layout fix */
.p-nav-opposite .p-navgroup-link--user .avatar {
    margin-right: 8px; /* Add space between avatar and username */
}

.p-nav-opposite .p-navgroup-link--user {
    display: flex;
    align-items: center;
}