/* Clubhouse 2026.1.75 MCP/UCP chrome + 16px leftovers */
/* Clubhouse = full DT2026 palette on every prosilver surface */

:root {
    --bg: #050506;
    --surface: #121214;
    --card: #1c1c22;
    --card-hover: #26262e;
    --gold: #c4a45a;
    --gold-dim: #8a7340;
    --text: #e8e4d8;
    --muted: #9a9488;
    --line: #2c2c34;
    --nav: #1a1a20;
    --ink: #0a0a0c;
    --strip: #16161c;
    --foot: #0a0a0c;
    --gold-hover: #e0c888;
}

html, body {
    color: var(--text) !important;
    background-color: var(--bg) !important;
    font-family: Assistant, Alef, Arial, sans-serif;
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
    padding: 0 !important;
}
body #wrap,
#page-body,
.list-inner,
.forumtitle, a.forumtitle,
.topictitle, a.topictitle,
.postbody, .content, .signature,
.postprofile, .notice,
li.row, dl.row-item dt, dl.row-item dd,
.panel, .panel p, .action-bar,
.tabs, .tabs .tab, .minitabs, .minitabs .tab,
.navigation, .cp-main, .cp-main .content,
.attachbox, .agreement {
    font-size: 16px !important;
    line-height: 1.65 !important;
}

h1 { color: var(--gold) !important; }
h2, h3, .content h2, .panel h2 {
    color: var(--gold) !important;
    border-bottom-color: var(--gold-dim) !important;
}
hr { border-color: var(--line) !important; border-top-color: var(--line) !important; }

a, a:link { color: var(--gold) !important; }
a:hover { color: var(--gold-hover) !important; }
a:visited { color: var(--gold-dim) !important; }

.forumbg .header a, .forabg .header a, th a,
table.table1 thead th { color: var(--gold) !important; }
.forumbg .header a:hover, .forabg .header a:hover, th a:hover { color: var(--gold-hover) !important; }

.postlink { color: var(--gold) !important; border-bottom-color: var(--gold-dim) !important; }
.postlink:visited { color: var(--gold-dim) !important; border-bottom-color: var(--gold-dim) !important; }
.postlink:hover { background: transparent !important; color: var(--gold-hover) !important; }
.signature a, .signature a:hover { background: transparent !important; color: var(--gold) !important; }
.top i { color: var(--muted) !important; }
.arrow-left:hover, .arrow-right:hover { color: var(--gold) !important; }

.wrap {
    max-width: 1080px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background-color: var(--surface) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: 0 0 64px rgba(0,0,0,0.8);
}

/* Big header image — same file as the WordPress site */
.headerbar {
    color: var(--text) !important;
    background: var(--ink) !important;
    background-image: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    min-height: 0 !important;
}
.headerbar .inner { padding: 0 !important; }
.headerbar .site-description {
    float: none !important;
    width: 100% !important;
}
.headerbar .logo {
    float: none !important;
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
.headerbar .site_logo {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 0 !important;
    padding: 0 0 30.44% 0 !important;
    margin: 0 !important;
    background-image: url("./images/header.png") !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100% auto !important;
}
.headerbar h1,
.headerbar .site-description > p:not(.skiplink) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
}

/* Search sits in the navbar row, physical left — same as the WordPress menubar */
#page-header {
    display: block;
}
.headerbar,
.headerbar .inner {
    display: block;
}
.navbar-primary {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem 0.75rem;
    min-height: 46px;
    padding: 0 0.75rem;
    box-sizing: border-box;
}
#nav-main {
    order: 1;
    padding-left: 0;
    padding-right: 0;
    flex: 1 1 auto;
    min-width: 0;
}
.search-header {
    order: 2;
    position: static !important;
    float: none !important;
    width: auto !important;
    height: auto;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    display: flex !important;
    align-items: center;
    z-index: 1;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    grid-row: auto;
    grid-column: auto;
}
.navbar .linklist > li.responsive-search {
    display: none !important;
}
.search-header fieldset {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin: 0;
    border: 0;
}
.search-header .inputbox,
.search-box .inputbox {
    width: 140px !important;
    float: none !important;
    background: var(--ink) !important;
    border: 1px solid var(--gold-dim) !important;
    border-radius: 0 !important;
    color: var(--text) !important;
    -webkit-text-fill-color: var(--text);
    font-size: 0.9rem !important;
    padding: 0.28rem 0.5rem !important;
}
.search-header .inputbox:focus,
.search-box .inputbox:focus {
    border-color: var(--gold) !important;
}
.search-header .inputbox::placeholder,
.search-box .inputbox::placeholder,
input.inputbox::placeholder {
    color: #d4cfc0 !important;
    -webkit-text-fill-color: #d4cfc0 !important;
    opacity: 1 !important;
}

/* Same charcoal gradient + gold edge as DT2026 #menubar.
   Do not set background-image:none after the gradient — that wipes it. */
#page-header .navbar,
#page-header .navbar .inner,
#page-header .navbar-primary {
    background: linear-gradient(180deg, #2a2a32 0%, #16161c 100%) !important;
    color: var(--text) !important;
    border-radius: 0 !important;
    border-bottom: 0;
}
#page-header .navbar {
    padding: 0 !important;
    border-bottom: 1px solid var(--gold-dim);
}
#page-header .navbar .linklist > li > a,
#page-header .nav-main a,
#page-header .navbar a:link,
#page-header .navbar a:visited {
    font-family: Assistant, Alef-Bold, Arial, sans-serif;
    font-size: 1rem !important;
    font-weight: 600;
    color: var(--text) !important;
}
.navbar a, .nav-main a, .nav-footer a, .breadcrumbs .crumb a { color: var(--text) !important; }
.navbar a:hover { color: var(--gold) !important; }
ul.navlinks { border-top-color: var(--line) !important; }

.forumbg, .forabg {
    background: var(--card) !important;
    background-image: none !important;
    border: 1px solid var(--line) !important;
    border-radius: 0 !important;
    padding: 0 !important;
}
ul.forums {
    background: var(--card) !important;
    background-image: none !important;
    filter: none !important;
}

.panel {
    background-color: var(--card) !important;
    color: var(--text) !important;
}
.post:target .content,
.post h3 a.first-unread,
.post:target h3 a { color: var(--text) !important; }

.bg1, table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) { background-color: #19191f !important; }
.bg2, table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) { background-color: var(--card) !important; }
.bg3 { background-color: var(--strip) !important; }
.ucprowbg, .fieldsbg { background-color: var(--card) !important; }

#page-body { padding: 1rem 1.25rem 2rem; color: var(--text) !important; }

ul.topiclist li { color: var(--text) !important; }
ul.topiclist dd { border-color: var(--line) !important; color: var(--muted) !important; }
.rtl ul.topiclist dd { border-color: var(--line) !important; }
li.row {
    background: var(--card) !important;
    border-top-color: var(--line) !important;
    border-bottom-color: var(--line) !important;
}
li.row strong { color: var(--text) !important; }
li.row:hover { background-color: var(--card-hover) !important; }
li.row:hover dd { border-color: var(--gold-dim) !important; }
li.header, li.header dt, li.header dd {
    background: var(--strip) !important;
    color: var(--gold) !important;
}

.postbody, .content, .signature, .postprofile, .notice, dl.faq dt { color: var(--text) !important; }
.postprofile { border-color: var(--line) !important; }
.postprofile strong { color: var(--gold) !important; }
.signature, .notice { border-top-color: var(--line) !important; }
.posthilit { background-color: var(--gold-dim) !important; color: var(--ink) !important; }

blockquote {
    background-color: var(--ink) !important;
    border-color: var(--gold-dim) !important;
    color: var(--text) !important;
}
blockquote blockquote,
blockquote blockquote blockquote { background-color: var(--strip) !important; }
.codebox, .attachbox {
    background-color: var(--ink) !important;
    border-color: var(--line) !important;
    color: var(--text) !important;
}
.codebox p { border-bottom-color: var(--line) !important; }
.codebox code { color: var(--gold) !important; }
.attachbox p, .attachbox p.stats, dl.file dd, dl.thumbnail dd { color: var(--muted) !important; }
dl.thumbnail img { border-color: var(--line) !important; background-color: var(--card) !important; }

.button {
    border-color: var(--gold-dim) !important;
    background: var(--ink) !important;
    background-image: none !important;
    filter: none !important;
    box-shadow: none !important;
    color: var(--gold) !important;
}
.button:hover, .button:focus {
    background: var(--gold) !important;
    color: var(--ink) !important;
    border-color: var(--gold) !important;
}

input.inputbox, textarea.inputbox, select,
.search-header .inputbox {
    background: var(--ink) !important;
    border: 1px solid var(--gold-dim) !important;
    color: var(--text) !important;
}

.dropdown, .dropdown-extended, .dropdown-contents,
.jumpbox .dropdown li {
    background: var(--card) !important;
    border-color: var(--line) !important;
    color: var(--text) !important;
}
.jumpbox-cat-link { background-color: var(--strip) !important; border-top-color: var(--gold-dim) !important; color: var(--gold) !important; }
.jumpbox-cat-link:hover { background-color: var(--card-hover) !important; color: var(--gold-hover) !important; }
.jumpbox-forum-link, .jumpbox-sub-link { background-color: var(--card) !important; }
.jumpbox-forum-link:hover, .jumpbox-sub-link:hover { background-color: var(--card-hover) !important; }

.copyright, #page-footer, .page-footer { background: var(--foot) !important; color: var(--muted) !important; }
.page-footer .navbar { background: var(--foot) !important; border-bottom: 0; border-top: 1px solid var(--line); }
.error, dd.profile-warnings { color: #e08a8a !important; }
.reported, li.reported:hover, div.rules, p.post-notice {
    background-color: #2a1818 !important;
    color: #e08a8a !important;
}

table.table1 tbody tr { border-color: var(--line) !important; }
table.table1 tbody tr:hover, table.table1 tbody tr.hover {
    background-color: var(--card-hover) !important;
    color: var(--text) !important;
}
table.table1 td, table.table1 tbody td { color: var(--text) !important; border-top-color: var(--line) !important; }
table.table1 tbody th, table.info tbody th, dl.details dt { color: var(--gold) !important; background-color: var(--card) !important; border-bottom-color: var(--line) !important; }
dl.details dd { color: var(--text) !important; }
.sep { color: var(--gold-dim) !important; }

.icon.icon-blue, a:hover .icon.icon-blue,
.icon.icon-green, a:hover .icon.icon-green,
.icon.icon-orange, a:hover .icon.icon-orange { color: var(--gold) !important; }
.icon.icon-red, a:hover .icon.icon-red { color: #e08a8a !important; }
.icon.icon-bluegray, .icon.icon-gray, .icon.icon-lightgray, a:hover .icon.icon-gray { color: var(--muted) !important; }
.icon.icon-black, a:hover .icon.icon-black { color: var(--text) !important; }

.forumtitle, .topictitle { color: var(--gold) !important; }
.time, .lastpost, .lastpost span, .topics, .posts,
.statistics, .stat-block, .stat-block p { color: var(--muted) !important; }

.pagination li a, .pagination li span {
    background: var(--card) !important;
    border-color: var(--line) !important;
    color: var(--text) !important;
}
.pagination li.active span {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--ink) !important;
}

fieldset.polls dl { border-top-color: var(--line) !important; color: var(--muted) !important; }
fieldset.polls dl.voted { color: var(--text) !important; }
.pollbar1, .pollbar2, .pollbar3, .pollbar4, .pollbar5 {
    background-color: var(--gold) !important;
    border-color: var(--gold-dim) !important;
}

.dropdown-extended a.mark_read { background-color: var(--card) !important; }
.alert_close .icon:before { background-color: var(--card) !important; }

/* Gold Font Awesome icons instead of stock GIFs */
dl.row-item {
    background-image: none !important;
    filter: none !important;
    position: relative;
}
dl.row-item::before {
    font-family: FontAwesome;
    content: "\f0e5";
    position: absolute;
    top: 50%;
    right: 12px;
    left: auto;
    transform: translateY(-50%);
    font-size: 1.2rem;
    line-height: 1;
    color: var(--gold-dim);
    width: 1.25em;
    text-align: center;
    pointer-events: none;
    z-index: 1;
}
li.header dl.row-item::before { content: none; }
dl.forum_read::before, dl.forum_read_subforum::before { content: "\f0e6"; color: var(--gold-dim); }
dl.forum_unread::before, dl.forum_unread_subforum::before { content: "\f086"; color: var(--gold); }
dl.forum_read_locked::before, dl.forum_unread_locked::before,
dl.topic_read_locked::before, dl.topic_unread_locked::before { content: "\f023"; }
dl.forum_unread_locked::before, dl.topic_unread_locked::before { color: var(--gold); }
dl.forum_link::before { content: "\f08e"; color: var(--gold-dim); }
dl.topic_read::before, dl.topic_read_mine::before, dl.topic_read_hot::before { content: "\f0f6"; color: var(--gold-dim); }
dl.topic_unread::before, dl.topic_unread_mine::before, dl.topic_unread_hot::before { content: "\f0f6"; color: var(--gold); }
dl.topic_moved::before { content: "\f064"; color: var(--muted); }
dl.sticky_read::before, dl.sticky_unread::before { content: "\f08d"; }
dl.sticky_unread::before { color: var(--gold); }
dl.sticky_read::before { color: var(--gold-dim); }
dl.announce_read::before, dl.announce_unread::before,
dl.global_read::before, dl.global_unread::before { content: "\f0a1"; }
dl.announce_unread::before, dl.global_unread::before { color: var(--gold); }
dl.announce_read::before, dl.global_read::before { color: var(--gold-dim); }

/* MCP / UCP — leftover prosilver light chrome */
.tabs .tab > a,
.minitabs .tab > a {
    background: var(--strip) !important;
    background-image: none !important;
    color: var(--text) !important;
    border-color: var(--line) !important;
    font-size: 16px !important;
    font-weight: 600;
    filter: none !important;
    box-shadow: none !important;
}
.tabs .tab > a:hover,
.minitabs .tab > a:hover {
    background: var(--card-hover) !important;
    color: var(--gold) !important;
}
.tabs .activetab > a,
.tabs .activetab > a:hover,
.minitabs .activetab > a,
.minitabs .activetab > a:hover {
    background: var(--card) !important;
    background-image: none !important;
    color: var(--gold) !important;
    border-color: var(--gold-dim) !important;
    box-shadow: none !important;
    filter: none !important;
}

.navigation a,
.rtl .navigation a,
#navigation a,
.rtl #navigation a {
    background: var(--card) !important;
    background-image: none !important;
    color: var(--text) !important;
    filter: none !important;
    font-size: 16px !important;
}
.navigation a:hover {
    background: var(--card-hover) !important;
    color: var(--gold) !important;
}
.navigation .active-subsection a,
.navigation .active-subsection a:hover {
    background: var(--strip) !important;
    color: var(--gold) !important;
}

.cp-mini { background-color: var(--card) !important; color: var(--text) !important; }
.cp-main .pm-message, .cp-main .pm {
    background-color: var(--ink) !important;
    border-color: var(--line) !important;
    color: var(--text) !important;
}
.panel-container .panel { background-color: var(--card) !important; }
.panel-container h2, .cp-main h2, .tabs-container h2 { color: var(--gold) !important; }
dl.mini dt { color: var(--gold) !important; }
.current { color: var(--gold) !important; }
.gallery label { background: var(--card) !important; border-color: var(--line) !important; color: var(--text) !important; }
.gallery label:hover { background-color: var(--card-hover) !important; }

label, dd label, fieldset dl:hover dt label { color: var(--text) !important; }
select {
    background-color: var(--ink) !important;
    color: var(--text) !important;
    border-color: var(--gold-dim) !important;
}

a.button1, input.button1, input.button3, a.button2, input.button2 {
    background: var(--ink) !important;
    background-image: none !important;
    color: var(--gold) !important;
    border-color: var(--gold-dim) !important;
    filter: none !important;
}
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
    background: var(--gold) !important;
    color: var(--ink) !important;
    border-color: var(--gold) !important;
}

.phpbb_alert {
    background: var(--card) !important;
    border-color: var(--gold-dim) !important;
    color: var(--text) !important;
}

@media (max-width: 700px) {
    .wrap { max-width: 100% !important; }
    #page-body { padding: 0.85rem; }
    .navbar-primary {
        flex-wrap: wrap;
    }
    .search-header {
        order: 0;
        flex: 1 1 100%;
        width: 100% !important;
        justify-content: flex-start;
        padding: 0.45rem 0 !important;
    }
    #nav-main {
        order: 1;
        flex: 1 1 100%;
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .search-header .inputbox { width: min(100%, 16rem) !important; }
}
