/* ==========================================================================
   PBWire theme  -  overrides on top of MyBB's default stylesheets
   Dark by default, follows the visitor's system when it prefers light,
   and the header toggle can force either. Mobile-first responsive.
   ========================================================================== */

:root {
  color-scheme: dark;
  --bg: #0c0e13;
  --bar: #090b0f;
  --surface: #141821;
  --surface-2: #1a2030;
  --surface-3: #212939;
  --line: #262e3f;
  --text: #e9ecf3;
  --muted: #8d97ab;
  --accent: #ff5a1f;
  --accent-2: #ff7d4d;
  --accent-ink: #ffffff;
  --accent-soft: rgba(255, 90, 31, .14);
  --good: #36c275;
  --bad: #ff5c5c;
  --warn: #f5a524;
  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 0 rgba(255,255,255,.03) inset, 0 8px 24px rgba(0,0,0,.28);
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;
    --bg: #f3f4f8;
    --bar: #ffffff;
    --surface: #ffffff;
    --surface-2: #f5f6fa;
    --surface-3: #eceef4;
    --line: #e1e4ec;
    --text: #151a25;
    --muted: #5d677c;
    --accent: #e8480c;
    --accent-2: #c93a04;
    --accent-soft: rgba(232, 72, 12, .10);
    --shadow: 0 1px 2px rgba(20,26,40,.05), 0 8px 24px rgba(20,26,40,.06);
  }
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f4f8; --bar: #ffffff; --surface: #ffffff; --surface-2: #f5f6fa; --surface-3: #eceef4;
  --line: #e1e4ec; --text: #151a25; --muted: #5d677c; --accent: #e8480c; --accent-2: #c93a04;
  --accent-soft: rgba(232, 72, 12, .10);
  --shadow: 0 1px 2px rgba(20,26,40,.05), 0 8px 24px rgba(20,26,40,.06);
}

/* ---------- base ---------- */
html { -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: var(--font) !important;
  font-size: 15px !important;
  line-height: 1.5;
  margin: 0 !important;
  -webkit-font-smoothing: antialiased;
}
a:link, a:visited { color: var(--accent-2); text-decoration: none; }
a:hover, a:active { color: var(--accent); text-decoration: underline; }
.smalltext, .largetext, .tcat, .thead, .trow1, .trow2, .tfoot { font-family: var(--font); }
.smalltext { color: var(--muted); font-size: 12.5px !important; }
.largetext { font-size: 17px !important; }
hr { border: 0; border-top: 1px solid var(--line); }
img { max-width: 100%; }
#container { max-width: none !important; min-width: 0 !important; width: auto !important; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; }
.wrapper { max-width: 1180px !important; min-width: 0 !important; width: auto !important; margin: 0 auto !important; padding: 0 18px !important; box-sizing: border-box; }
table.tfixed, .tfixed { table-layout: auto; }
html, body { overflow-x: hidden; }
br.clear { display: none; }

/* ---------- header: brand bar ---------- */
#header { background: none !important; }
#logo {
  background: var(--bar) !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 0 !important;
  position: sticky; top: 0; z-index: 50;
}
#logo .wrapper { display: flex; align-items: center; gap: 22px; min-height: 62px; }
#logo .wrapper > a { display: inline-flex; align-items: center; flex: none; }
#logo img { height: 34px; width: auto; display: block; }
#logo { color: var(--text); }
#logo .pbw-wordmark { height: 34px; width: auto; display: block; color: var(--text); }
#logo .wrapper > a:hover { text-decoration: none; }
#logo ul.top_links { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 0 auto !important; padding: 0; list-style: none; float: none !important; }
#logo ul.top_links li { margin: 0 !important; padding: 0 !important; }
#logo ul.top_links a {
  background: none !important; padding: 8px 12px !important; border-radius: 9px;
  color: var(--muted) !important; font-weight: 600; font-size: 14px; display: block; text-decoration: none;
}
#logo ul.top_links a:hover { color: var(--text) !important; background: var(--surface-2) !important; }
#pbw-theme-toggle {
  flex: none; margin-left: 4px; width: 38px; height: 38px; border-radius: 10px; cursor: pointer;
  border: 1px solid var(--line); background: var(--surface); color: var(--muted); font-size: 17px; line-height: 1;
}
#pbw-theme-toggle:hover { color: var(--text); border-color: var(--accent); }

/* ---------- header: user bar ---------- */
/* a full-width secondary bar: its own surface, hairline borders, two tidy rows */
#panel {
  background: var(--surface) !important; color: var(--muted) !important;
  border: 0 !important; border-bottom: 1px solid var(--line) !important;
  padding: 10px 0 !important;
}
#panel .upper, #panel .lower { background: none !important; border: 0 !important; padding: 0 !important; color: var(--muted) !important; }
#panel .upper .wrapper { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
#panel .upper .welcome { order: 1; font-size: 13px; color: var(--muted); flex: 1 1 auto; }
#panel .upper .welcome strong { font-weight: 500; }
#panel .upper .welcome a { color: var(--text) !important; font-weight: 700; }
#panel .upper .welcome a.logout {
  color: var(--muted) !important; font-weight: 600; margin-left: 10px; padding: 3px 10px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--surface-2) !important; background-image: none !important; font-size: 12px;
}
#panel .upper .welcome a.logout:hover { color: var(--accent) !important; border-color: var(--accent); text-decoration: none; }
#panel .upper form { order: 2; margin: 0; float: none !important; }
#search { border: 0; margin: 0; padding: 0; display: flex; gap: 6px; }
#panel .lower { margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid var(--line) !important; }
#panel .lower .wrapper { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; }
#panel .lower ul.menu { margin: 0 !important; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; float: none !important; }
#panel .lower ul.menu li { margin: 0 !important; padding: 0 !important; font-size: 13px; color: var(--muted); }
#panel .lower ul.panel_links a {
  display: inline-block; background: var(--surface-2) !important; background-image: none !important; padding: 5px 12px !important;
  border: 1px solid var(--line); border-radius: 999px; color: var(--text) !important; font-weight: 600; font-size: 12.5px;
}
#panel .lower ul.panel_links a:hover { border-color: var(--accent); color: var(--accent) !important; text-decoration: none; }
#panel .lower ul.user_links { margin-left: auto !important; gap: 4px 16px; }
#panel .lower ul.user_links a { background: none !important; padding: 0 !important; color: var(--muted) !important; }
#panel .lower ul.user_links a:hover { color: var(--accent) !important; }

/* ---------- content shell ---------- */
#content { background: none !important; border: 0 !important; padding: 14px 0 40px !important; }
#content .wrapper { overflow: visible; }
.navigation { color: var(--muted) !important; font-size: 13px !important; padding: 6px 0 14px !important; }
.navigation a { color: var(--muted) !important; }
.navigation a:hover { color: var(--accent) !important; }
.navigation .active { color: var(--text) !important; font-weight: 700; font-size: 15px; }
.navigation .nav_sep { opacity: .5; }
.navigation br, #content > .wrapper > br { display: none; }

/* ---------- cards: tables become rounded panels ---------- */
table.tborder {
  border: 1px solid var(--line) !important; border-radius: var(--radius); overflow: hidden;
  border-collapse: separate !important; border-spacing: 0; background: var(--surface) !important;
  box-shadow: var(--shadow); margin-bottom: 18px !important; width: 100% !important;
}
.tborder .thead {
  background: var(--surface-2) !important; color: var(--text) !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; padding: 14px 16px !important; font-size: 15px;
}
.tborder .thead a:link, .tborder .thead a:visited { color: var(--text) !important; }
.tborder .thead a:hover { color: var(--accent) !important; }
.tborder .thead strong { font-size: 16px; letter-spacing: .1px; }
.tborder .thead .smalltext { color: var(--muted) !important; }
.tborder .thead .expcolimage { opacity: .6; }
.tborder .tcat {
  background: var(--surface) !important; color: var(--muted) !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; padding: 8px 14px !important;
  font-size: 11.5px !important; text-transform: uppercase; letter-spacing: .09em; font-weight: 700;
}
.tborder .tcat * { color: var(--muted) !important; font-size: 11.5px !important; }
.tborder .tcat a { color: var(--muted) !important; }
.tborder .trow1, .tborder .trow2 {
  background: var(--surface) !important; color: var(--text) !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; padding: 14px 16px !important; vertical-align: middle;
}
.tborder .trow2 { background: var(--surface) !important; }
.tborder tr:hover > .trow1, .tborder tr:hover > .trow2 { background: var(--surface-2) !important; }
.tborder .trow_sep {
  background: var(--surface-3) !important; color: var(--muted) !important; border: 0 !important;
  padding: 7px 16px !important; font-size: 11.5px; text-transform: uppercase; letter-spacing: .09em; font-weight: 700;
}
.tborder .tfoot { background: var(--surface-2) !important; color: var(--muted) !important; border: 0 !important; padding: 10px 14px !important; }
.tborder tr:last-child > td { border-bottom: 0 !important; }
.trow1 strong a, .trow2 strong a { font-size: 15.5px; font-weight: 700; }
.trow1 .smalltext, .trow2 .smalltext { color: var(--muted); }
td.trow1[align="center"], td.trow2[align="center"] { color: var(--muted); font-variant-numeric: tabular-nums; }

/* forum status -> glowing dot */
.forum_status {
  display: inline-block; width: 12px; height: 12px; border-radius: 50%; background-image: none !important;
  background-color: var(--line) !important; box-shadow: 0 0 0 3px var(--surface-3);
}
.forum_on { background-color: var(--accent) !important; box-shadow: 0 0 0 3px var(--accent-soft), 0 0 12px var(--accent) !important; }
.forum_offlock, .forum_offlink { background-color: var(--warn) !important; opacity: .6; }
td.trow1[width="1"], td.trow2[width="1"] { padding-right: 0 !important; }

/* sub-forum list */
.subforumicon { display: none; }

/* ---------- thread list ---------- */
.threadlist td.trow1, .threadlist td.trow2 { padding: 12px 14px !important; }
.subject_new { font-weight: 800; }
.subject_old { font-weight: 600; }
.threadlist a[id^="tid_"] { color: var(--text) !important; font-size: 15.5px; }
.threadlist a[id^="tid_"]:hover { color: var(--accent) !important; }
.tborder img[src*="folder"], .tborder img[src*="dot_"] { opacity: .85; }
.thread_status { width: 10px; height: 10px; border-radius: 50%; background: var(--line) !important; display: inline-block; }
.thread_status.newfolder, .thread_status.hotnewfolder, .thread_status.dot_newfolder { background: var(--accent) !important; }

/* ratings column (thread star ratings) are noise; hide */
.star_rating, .star_rating_notrated, ul.star_rating { display: none !important; }
.tborder td:has(> ul.star_rating), .tborder td:has(> .star_rating) { display: none; }

/* thread prefix pills (class added to each prefix's display style) */
/* tags read like classic forum tags: bold, colour-coded, in [brackets] */
.pbw-prefix {
  font-size: .92em; letter-spacing: .02em; padding: 0; margin-right: 6px; white-space: nowrap;
  font-weight: 800 !important; text-transform: uppercase; background: none;
}
.pbw-prefix::before { content: "["; opacity: .75; }
.pbw-prefix::after { content: "]"; opacity: .75; }

/* quieter links in lists: titles are neutral, accent on hover */
.tborder .trow1 strong a:link, .tborder .trow1 strong a:visited,
.tborder .trow2 strong a:link, .tborder .trow2 strong a:visited { color: var(--text); }
.tborder .trow1 strong a:hover, .tborder .trow2 strong a:hover { color: var(--accent); text-decoration: none; }
.threadlist a[id^="tid_"], .threadlist span a[id^="tid_"] { font-weight: 700; }
.expcolimage, img[src*="jump.png"], img[src*="newtopic"] { display: none !important; }
.subject_new a:link, .subject_new a:visited, .subject_old a:link, .subject_old a:visited,
a.subject_new:link, a.subject_new:visited, a.subject_old:link, a.subject_old:visited { color: var(--text) !important; }
.subject_new a:hover, .subject_old a:hover, a.subject_new:hover, a.subject_old:hover { color: var(--accent) !important; text-decoration: none; }
.subject_old, a.subject_old { font-weight: 600 !important; }
.subject_new, a.subject_new { font-weight: 800 !important; }
.thead .float_right, .thead .float_right a { font-size: 12.5px !important; font-weight: 500 !important; color: var(--muted) !important; }
.thead .float_right a:hover { color: var(--accent) !important; }
.thead .float_right strong { font-weight: 500; }
.author_information a:link, .author_information a:visited { color: var(--text); }
.smalltext a:link, .smalltext a:visited { color: var(--muted); }
.smalltext a:hover { color: var(--accent); }

/* ---------- buttons & forms ---------- */
.button, input.button, button.button, a.button,
input[type="submit"], input[type="button"], button {
  font-family: var(--font); font-size: 14px; font-weight: 600; cursor: pointer;
  background: var(--surface-2) !important; color: var(--text) !important;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  padding: 8px 14px !important; line-height: 1.2; box-shadow: none !important;
}
.button:hover, input[type="submit"]:hover, input[type="button"]:hover, button:hover { border-color: var(--accent) !important; }
/* primary actions only; everything else stays neutral */
#search .button, a.button.new_thread_button, .newthread a, .newreply a, .new_thread_button, a.new_reply_button,
input.button[name="submit"], input.button[name="postthread"], input.button[name="submit_reply"],
input.button[value^="Post"], input.button[value^="Submit"], input.button[value^="Login"], input.button[value^="Save"],
input.button[value^="Update"], input.button[value^="Send"], input.button[value^="I Agree"], input.button[value^="Request"],
input.button[value^="Verify"], input.button[value^="Register"], input.button[value^="Search"], input.button[value^="Reply"],
input.button[value^="Continue"], input.button[value^="Create"], input.button[value^="Add"] {
  background: var(--accent) !important; border-color: var(--accent) !important; color: var(--accent-ink) !important;
}
input.button[value="Go"], input.button[value="Go!"], input.button[name="delete"], input.button[value^="Delete"], input.button[value="Clear"] {
  background: var(--surface-2) !important; border-color: var(--line) !important; color: var(--text) !important;
}
input.button[name="delete"], input.button[value^="Delete"] { color: var(--bad) !important; }
.button:disabled, input:disabled { opacity: .5; cursor: not-allowed; }
.postbit_buttons a.postbit_quote.postbit_mirage { }
input.textbox, input.field150, input.field120, input.field100, textarea, select, .editor_control_bar, input[type="text"], input[type="password"], input[type="email"], input[type="number"] {
  background: var(--surface-2) !important; color: var(--text) !important; font-family: var(--font); font-size: 14px;
  border: 1px solid var(--line) !important; border-radius: 10px !important; padding: 8px 10px; box-sizing: border-box;
}
select { padding: 7px 8px; }
input.textbox:focus, textarea:focus, select:focus, input[type="text"]:focus { outline: none; border-color: var(--accent) !important; box-shadow: 0 0 0 3px var(--accent-soft); }
#search input.textbox { width: 200px; }
fieldset { border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); }
legend { color: var(--muted); }

/* ---------- posts ---------- */
#posts .post, .post { background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: var(--radius) !important; margin: 0 0 14px !important; overflow: hidden; box-shadow: var(--shadow); }
.post.classic { }
.post .post_author {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: var(--surface-2) !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; padding: 14px 16px !important; margin: 0 !important; overflow: visible;
}
.post .post_author .author_avatar { float: none !important; margin: 0 !important; }
.post .post_author .author_avatar img { width: 48px; height: 48px; border-radius: 12px; object-fit: cover; border: 1px solid var(--line) !important; background: var(--surface-3); padding: 0 !important; }
.post .post_author .author_information { float: none !important; padding: 0 !important; flex: 1 1 200px; font-size: 13px; color: var(--muted); }
.post .post_author .author_information strong { font-size: 16px; }
.post .post_author .author_statistics {
  float: none !important; margin: 0 !important; padding: 0 !important; font-size: 13px; color: var(--muted);
  text-align: right; line-height: 1.6;
}
.post .post_author .author_statistics a { color: var(--text) !important; }
.post .post_author .author_statistics strong { font-weight: 800; }
/* trust line: make feedback stand out */
.post .post_author .author_statistics [class*="ougcfeedback_info"] {
  display: inline-block; margin-top: 4px; padding: 3px 10px; border-radius: 999px;
  background: var(--accent-soft); color: var(--text); font-weight: 700; font-size: 12.5px;
}
.post .post_author .author_statistics [class*="ougcfeedback_info"] br { display: none; }
.post .post_content { padding: 0 !important; margin: 0 !important; }
.post .post_head { border: 0 !important; background: none !important; padding: 12px 16px 0 !important; margin: 0 !important; font-size: 12.5px; color: var(--muted); }
.post .post_head a { color: var(--muted); }
.post .post_head h2 { margin: 0; }
.post .post_body { padding: 10px 16px 14px !important; margin: 0 !important; font-size: 15.5px !important; line-height: 1.6; color: var(--text) !important; overflow-wrap: anywhere; }
.post .post_meta { padding: 0 16px 8px !important; color: var(--muted); font-size: 12.5px; }
.post .signature { border-top: 1px solid var(--line) !important; margin-top: 14px; padding-top: 10px; color: var(--muted); font-size: 12.5px; }
.post .post_controls { background: none !important; border: 0 !important; border-top: 1px solid var(--line) !important; padding: 10px 14px !important; display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }
.post .post_controls::after, .post .post_controls::before { display: none; }
.postbit_buttons { float: none !important; display: flex; flex-wrap: wrap; gap: 6px; }
.postbit_buttons > a {
  background-image: none !important; background-color: var(--surface-2) !important; color: var(--text) !important;
  border: 1px solid var(--line) !important; border-radius: 9px !important; padding: 5px 10px !important; margin: 0 !important;
  font-size: 12.5px !important; font-weight: 600; text-decoration: none !important; display: inline-block;
}
.postbit_buttons > a span { background: none !important; padding: 0 !important; display: inline !important; }
.postbit_buttons > a:hover { border-color: var(--accent) !important; color: var(--accent) !important; }
.postbit_buttons a.postbit_quote, .postbit_buttons a.postbit_reply { color: var(--accent-2) !important; }
.postbit_buttons a.postbit_warn { color: var(--warn) !important; }
.postbit_buttons a.postbit_qdelete { color: var(--bad) !important; }
.post_author .buddy_status { display: none; }
blockquote.mycode_quote, .mycode_quote {
  background: var(--surface-2) !important; border: 0 !important; border-left: 3px solid var(--accent) !important;
  border-radius: 8px; padding: 10px 14px !important; margin: 10px 0 !important; color: var(--text);
}
.mycode_quote cite { color: var(--muted); font-style: normal; font-weight: 700; border: 0 !important; display: block; margin-bottom: 4px; padding: 0 !important; }
.codeblock { background: var(--bg) !important; border: 1px solid var(--line) !important; border-radius: 8px; color: var(--text); }
.codeblock .title { border-bottom: 1px solid var(--line) !important; color: var(--muted); background: var(--surface-2) !important; }
.codeblock code { background: none !important; color: var(--text); }
.reputation_positive, .ougc_feedback_positive { color: var(--good) !important; }
.reputation_negative, .ougc_feedback_negative { color: var(--bad) !important; }
.reputation_neutral { color: var(--muted) !important; }
.post_author .ougcfeedback_info_17, [class^="ougcfeedback_info_"] { }

/* ---------- pagination, popups, alerts ---------- */
.pagination { font-size: 13px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin: 8px 0; }
.pagination a, .pagination .pagination_current {
  display: inline-block; padding: 5px 10px; border-radius: 8px; border: 1px solid var(--line) !important;
  background: var(--surface) !important; color: var(--text) !important; text-decoration: none !important;
}
.pagination .pagination_current { background: var(--accent) !important; border-color: var(--accent) !important; color: var(--accent-ink) !important; }
.pagination a:hover { border-color: var(--accent) !important; }
.pagination .pages { margin-right: 6px; }
.popup_menu { background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 10px; box-shadow: var(--shadow); overflow: hidden; }
.popup_menu .popup_item { color: var(--text) !important; padding: 8px 14px !important; display: block; }
.popup_menu .popup_item:hover { background: var(--surface-2) !important; }
.pm_alert, .red_alert, .high_warning, .low_warning, .moderation_alert, div.error, .error {
  background: var(--accent-soft) !important; border: 1px solid var(--accent) !important; color: var(--text) !important; border-radius: 10px;
}
.success_message { color: var(--good); }
.modal { background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: var(--radius); color: var(--text); }
.modal .modal-body, .modal_thead { color: var(--text); }

/* ---------- footer ---------- */
#footer { background: none !important; border: 0 !important; color: var(--muted) !important; padding: 8px 0 40px !important; }
#footer .upper, #footer .lower { background: none !important; border: 0 !important; color: var(--muted) !important; }
#footer a { color: var(--muted) !important; }
#footer a:hover { color: var(--accent) !important; }
#footer .upper ul.menu { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding: 0; list-style: none; }
#footer .upper { padding-bottom: 14px; border-bottom: 1px solid var(--line) !important; margin-bottom: 14px; }
#footer .upper .language, #footer .upper .theme { float: none; display: inline-block; margin-left: 8px; }

/* stats strip */
.tborder td.trow1 > .smalltext a { }

/* ---------- misc defaults to neutralise ---------- */
.float_right { float: right; } .float_left { float: left; }
.expander { filter: invert(1) opacity(.5); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .expander { filter: opacity(.5); } }
:root[data-theme="light"] .expander { filter: opacity(.5); }
img[src*="spacer"] { display: none; }

/* ==========================================================================
   Pass 2: forms, editor, auth pages, user panel, footer
   ========================================================================== */
/* light mode: darker status colours so they stay readable on white */
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --good: #1c8a4b; --bad: #d23b3b; --warn: #a85f00; } }
:root[data-theme="light"] { --good: #1c8a4b; --bad: #d23b3b; --warn: #a85f00; }
:root { --icon-filter: invert(.88) hue-rotate(180deg); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --icon-filter: none; } }
:root[data-theme="light"] { --icon-filter: none; }

input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); width: 15px; height: 15px; vertical-align: -2px; }
::placeholder { color: var(--muted); opacity: .8; }
::selection { background: rgba(255, 90, 31, .35); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.tborder .trow1 label, .tborder .trow2 label { cursor: pointer; }

/* guest buttons in the header */
#panel .upper .welcome a.login, #panel .upper .welcome a.register {
  display: inline-block; padding: 5px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 700;
  background-image: none !important; margin-left: 6px; text-decoration: none;
}
#panel .upper .welcome a.login { border: 1px solid var(--line); background: var(--surface-2) !important; color: var(--text) !important; }
#panel .upper .welcome a.register { border: 1px solid var(--accent); background: var(--accent) !important; color: var(--accent-ink) !important; }
#panel .upper .welcome a.login:hover { border-color: var(--accent); }
#panel .upper .welcome a.register:hover { filter: brightness(1.08); }

/* ---------- login / lost password: a centred card ---------- */
form:has(> input[name="action"][value="do_login"]) > table.tborder,
form:has(> input[name="action"][value="do_lostpw"]) > table.tborder,
form:has(> input[name="action"][value="do_resendactivation"]) > table.tborder { max-width: 460px; margin: 28px auto 12px !important; }
form:has(> input[name="action"][value="do_login"]) tr:has(input[name="username"]) > td,
form:has(> input[name="action"][value="do_login"]) tr:has(input[name="password"]) > td,
form:has(> input[name="action"][value="do_lostpw"]) tr:has(input[name="email"]) > td { display: block; width: auto !important; padding: 10px 18px 0 !important; border: 0 !important; }
form:has(> input[name="action"][value="do_login"]) input.textbox,
form:has(> input[name="action"][value="do_lostpw"]) input.textbox { width: 100% !important; }
form:has(> input[name="action"][value="do_login"]) tr:last-child > td,
form:has(> input[name="action"][value="do_lostpw"]) tr:last-child > td { padding: 14px 18px !important; }
form:has(> input[name="action"][value="do_login"]) + div, form:has(> input[name="action"][value="do_login"]) ~ br { text-align: center; }
form:has(> input[name="action"][value="do_login"]) { text-align: left; }
form:has(> input[name="action"][value="do_login"]) > br + div[align="center"],
form:has(> input[name="action"][value="do_login"]) > div[align="center"] { text-align: center; }

/* long agreement text: readable measure */
.trow1 p, .trow2 p { max-width: 78ch; }

/* ---------- editor (SCEditor) ---------- */
.sceditor-container {
  background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 12px !important;
  overflow: hidden; box-shadow: none !important; max-width: 100%;
}
.sceditor-container iframe, .sceditor-container textarea { background: var(--surface) !important; color: var(--text) !important; }
.sceditor-container textarea { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: 12px 14px !important; border: 0 !important; border-radius: 0 !important; }
.sceditor-toolbar {
  background: var(--surface-2) !important; border: 0 !important; border-bottom: 1px solid var(--line) !important;
  padding: 6px 8px !important; overflow: visible; display: flex; flex-wrap: wrap; gap: 2px;
}
.sceditor-group { background: none !important; border: 0 !important; box-shadow: none !important; margin: 0 6px 0 0 !important; padding: 0 !important; display: inline-flex; }
.sceditor-button { border-radius: 8px !important; border: 1px solid transparent !important; background: none !important; margin: 0 1px !important; }
.sceditor-button:hover, .sceditor-button.active { background: var(--surface-3) !important; border-color: var(--line) !important; box-shadow: none !important; }
.sceditor-button div { filter: var(--icon-filter); }
.sceditor-button-bold div, .sceditor-button-italic div { opacity: .95; }
.sceditor-dropdown {
  background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 12px !important;
  box-shadow: var(--shadow) !important; color: var(--text) !important; padding: 10px !important;
}
.sceditor-dropdown a, .sceditor-dropdown label, .sceditor-dropdown td { color: var(--text) !important; }
.sceditor-dropdown a:hover { background: var(--surface-2) !important; }
.sceditor-dropdown input[type="text"] { width: 100%; }
.sceditor-color-option { border-radius: 4px; }
.sceditor-font-option, .sceditor-fontsize-option { color: var(--text) !important; }
.sceditor-fontsize-option:hover, .sceditor-font-option:hover { background: var(--surface-2) !important; }
.sceditor-resize-cover { }
.sceditor-grip { opacity: .4; }
/* the smilies side box */
.smilies, #smilie_list, .tborder .smilies { }
td:has(> .tborder img[src*="smilies"]) .tborder { box-shadow: none; }
.smilie_pointer { cursor: pointer; border-radius: 4px; }
.smilie_pointer:hover { background: var(--surface-3); }

/* select2 (user search boxes) */
.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple {
  background: var(--surface-2) !important; border: 1px solid var(--line) !important; border-radius: 10px !important; min-height: 38px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered, .select2-container--default .select2-search__field { color: var(--text) !important; line-height: 36px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--muted) !important; }
.select2-dropdown { background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 10px; box-shadow: var(--shadow); color: var(--text); overflow: hidden; }
.select2-container--default .select2-results__option { color: var(--text); padding: 8px 12px; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--accent) !important; color: var(--accent-ink) !important; }
.select2-container--default .select2-search--dropdown .select2-search__field { background: var(--surface-2) !important; border: 1px solid var(--line) !important; border-radius: 8px; }

/* select2 v3 (what MyBB 1.8 actually ships) */
.select2-container .select2-choice, .select2-container-multi .select2-choices {
  background: var(--surface-2) !important; background-image: none !important; border: 1px solid var(--line) !important;
  border-radius: 10px !important; color: var(--text) !important; box-shadow: none !important; min-height: 38px; height: auto;
}
.select2-container .select2-choice { height: 38px; line-height: 36px; }
.select2-container .select2-choice > .select2-chosen, .select2-container-multi .select2-choices .select2-search-field input { color: var(--text) !important; background: none !important; }
.select2-container .select2-choice .select2-arrow { background: none !important; border: 0 !important; border-radius: 0 10px 10px 0; }
.select2-container .select2-choice .select2-arrow b { background-position: 0 1px; filter: var(--icon-filter); }
.select2-container .select2-default, .select2-container .select2-choice .select2-chosen.select2-default { color: var(--muted) !important; }
.select2-drop, .select2-drop-active { background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 10px !important; color: var(--text) !important; box-shadow: var(--shadow) !important; }
.select2-drop.select2-drop-above { border-radius: 10px !important; }
.select2-search input { background: var(--surface-2) !important; background-image: none !important; border: 1px solid var(--line) !important; border-radius: 8px !important; color: var(--text) !important; }
.select2-results { background: none !important; color: var(--text); }
.select2-results .select2-highlighted { background: var(--accent) !important; color: var(--accent-ink) !important; }
.select2-results .select2-no-results, .select2-results .select2-searching, .select2-results .select2-selection-limit { background: none !important; color: var(--muted); }
.select2-container-multi .select2-choices .select2-search-choice { background: var(--surface-3) !important; border: 1px solid var(--line) !important; color: var(--text) !important; border-radius: 8px; box-shadow: none; }

/* ---------- user control panel & mod CP menus ---------- */
.tborder td.tcat.tcat_menu, td.tcat_menu { background: var(--surface) !important; padding: 10px 14px 4px !important; border: 0 !important; }
.tborder .trow1.trow_selected, .trow_selected { background: var(--accent-soft) !important; }
/* side menus: plain, tidy rows (the old sprite icons are dropped) */
a.usercp_nav_item, a.usercp_nav_sub_item, a.usercp_nav_home, a.usercp_nav_pmfolders, a.modcp_nav_item {
  display: block; background-image: none !important; padding: 8px 14px !important; margin: 1px 6px;
  border-radius: 8px; font-size: 14px; color: var(--text) !important; text-decoration: none;
}
a.usercp_nav_sub_item { padding-left: 28px !important; font-size: 13px; color: var(--muted) !important; }
a.usercp_nav_item:hover, a.usercp_nav_sub_item:hover, a.usercp_nav_home:hover, a.modcp_nav_item:hover { background: var(--surface-2); color: var(--accent) !important; text-decoration: none; }
td.trow1:has(> a.usercp_nav_item), td.trow1:has(> a.usercp_nav_home), td.trow1:has(> a.usercp_nav_sub_item), td.trow1:has(> a.modcp_nav_item) { padding: 2px 0 !important; border: 0 !important; }
.tborder td.tcat.tcat_menu, td.tcat_menu { letter-spacing: .09em; }
.usercp_nav_item img, .usercp_nav_sub_item img, a.usercp_nav_item::before { display: none; }

/* ---------- avatars & profile ---------- */
img[src*="default_avatar"], .profile_avatar img, td img[alt*="Avatar"] { border-radius: 14px; }
.author_avatar img { border-radius: 12px; }
.profile_avatar img, .tborder td img[src*="uploads/avatars"] { border-radius: 14px; border: 1px solid var(--line); }
/* username styling of staff groups is set in the group name style; keep bold, no italics */
em { font-style: normal; }
.tborder td strong em { font-style: normal; }

/* ---------- tag filter buttons (built by pbwire.js) ---------- */
.pbw-filter { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 2px 0; overflow-x: auto; scrollbar-width: none; }
.pbw-filter::-webkit-scrollbar { display: none; }
.pbw-filter-label { flex: none; color: var(--muted); font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; margin-right: 2px; }
.pbw-chip {
  flex: none; padding: 6px 14px !important; border-radius: 999px !important; font-size: 13px !important; font-weight: 700 !important;
  background: var(--surface) !important; color: var(--muted) !important; border: 1px solid var(--line) !important; cursor: pointer; letter-spacing: .02em;
}
.pbw-chip:hover { color: var(--text) !important; border-color: var(--accent) !important; }
.pbw-chip.active { background: var(--accent-soft) !important; color: var(--accent) !important; border-color: var(--accent) !important; }

/* ---------- feedback report page ---------- */
td[id^="feedbackID"] { padding: 16px 18px !important; line-height: 1.55; }
td[id^="feedbackID"] .postbit_buttons { float: right !important; display: inline-flex; margin: 0 0 6px 6px; }
td[id^="feedbackID"] .postbit_buttons > a { font-size: 12px !important; padding: 4px 10px !important; }
td[id^="feedbackID"] .smalltext { color: var(--muted); }
td[id^="feedbackID"] > a:first-of-type { font-weight: 700; }
td[id^="feedbackID"] strong.reputation_positive, td[id^="feedbackID"] strong.reputation_negative, td[id^="feedbackID"] strong.reputation_neutral { font-weight: 800; }
td.trow_reputation_positive { box-shadow: inset 3px 0 0 var(--good); }
td.trow_reputation_negative { box-shadow: inset 3px 0 0 var(--bad); }
td.trow_reputation_neutral { box-shadow: inset 3px 0 0 var(--muted); }
/* hide unrated (0-star) rating rows; style the stars that remain */
div.float_right:has(> .ui.rating[data-rating="0"]) { display: none; }
.ui.rating { color: var(--warn); }
.ui.disabled.rating .icon { opacity: 1; }
.ui.rating .icon { color: var(--muted) !important; opacity: .6; }
.ui.rating .active.icon, .ui.rating .selected.icon { color: var(--warn) !important; opacity: 1; }
.ui.rating .icon:hover { color: var(--warn) !important; opacity: 1; }
/* modal dialogs */
.modal, .modal .modal-body { overflow-x: hidden !important; box-sizing: border-box; }
.modal .modal-body table { width: 100% !important; table-layout: auto; }
.modal .modal-body td, .modal .modal-body th { word-break: break-word; }
.modal .modal-body td em, .modal .modal-body td i { font-style: normal; font-weight: 700; }
.blocker { background: rgba(0, 0, 0, .6) !important; }
.modal a.close-modal { filter: none; }
/* the "Total Feedback" count badge (plugin ships light-mode colours) */
.ougc_feedback_repbox {
  display: inline-block; min-width: 1.6em; padding: 2px 10px; border-radius: 999px; text-align: center;
  font-weight: 800; border: 0 !important; background: var(--surface-3) !important; color: var(--text) !important;
}
.ougc_feedback_repbox._positive, .ougc_feedback_repbox.positive { background: color-mix(in srgb, var(--good) 18%, transparent) !important; color: var(--good) !important; }
.ougc_feedback_repbox._negative, .ougc_feedback_repbox.negative { background: color-mix(in srgb, var(--bad) 18%, transparent) !important; color: var(--bad) !important; }
.ougc_feedback_repbox._neutral, .ougc_feedback_repbox.neutral { background: var(--surface-3) !important; color: var(--muted) !important; }
.profile-stat-boxes h2 { margin: 0; }

/* feedback box in the member list: compact pill */
.memberlist_stat_box_wrap { display: block; margin-top: 7px; }
.memberlist_stat_box_wrap a.stat_box_href, .memberlist_stat_box_wrap a.stat_box_href:link, .memberlist_stat_box_wrap a.stat_box_href:visited {
  display: inline-block; padding: 3px 11px; border-radius: 999px; background: var(--accent-soft); color: var(--text) !important; text-decoration: none; border: 1px solid transparent;
}
.memberlist_stat_box_wrap a.stat_box_href:hover { border-color: var(--accent); }
.memberlist_stat_box_wrap .profile-stat-boxes { display: inline-flex; align-items: baseline; gap: 6px; margin: 0; padding: 0; }
.memberlist_stat_box_wrap h2 { margin: 0; font-size: 13.5px; font-weight: 800; color: var(--text); display: inline; }
.memberlist_stat_box_wrap .smalltext { font-size: 12.5px !important; color: var(--muted); display: inline; }

/* ---------- search results, errors, redirects ---------- */
div.error, .pm_alert, .redirect_message { }
td.trow1.redirect_msg, .redirect { text-align: center; }
.tborder .thead .search_results, .tborder .thead > .float_right { }
table.tborder.tfixed { table-layout: auto; }

/* ---------- footer ---------- */
#footer { margin-top: 12px; }
#footer .upper .language, #footer .upper .theme { display: none; }
#footer .upper .wrapper { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
#footer ul.bottom_links { margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; float: none; }
#footer ul.bottom_links li { margin: 0; padding: 0; font-size: 13px; }
#footer .lower .wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; font-size: 12.5px; }
#footer .lower { padding-top: 4px !important; }
#footer #current_time, #footer #copyright { float: none !important; }
.tborder + div[align="center"], #debug, .debuginfo, div.debuginfo { color: var(--muted); font-size: 12px; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 860px) {
  .wrapper { padding: 0 12px !important; }
  #logo .wrapper { flex-wrap: wrap; gap: 8px 12px; padding-top: 8px !important; padding-bottom: 8px !important; }
  #logo ul.top_links { order: 3; width: 100%; margin: 0 !important; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  #logo ul.top_links::-webkit-scrollbar { display: none; }
  #logo ul.top_links a { white-space: nowrap; }
  #pbw-theme-toggle { margin-left: auto; width: 36px; height: 36px; }
  #logo .wrapper { min-height: 0; }
  #panel .upper { padding-top: 8px !important; }
  #panel .upper .welcome { font-size: 12.5px; }
  #panel .lower .wrapper { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 16px; }
  #panel .lower .wrapper::-webkit-scrollbar { display: none; }
  #panel .lower ul.menu { flex-wrap: nowrap; white-space: nowrap; }
  #panel .lower ul.menu li { white-space: nowrap; }
  #search input.textbox { width: 150px; }
  #panel .lower ul.user_links { margin-left: 0 !important; }
  /* forum + thread tables: hide numeric columns, keep title + last post */
  .tborder .tcat { display: none; }
  /* forum index rows: keep status dot + title; hide counts and last post */
  table.tborder:has(.forum_status) > tbody > tr > td:nth-child(n+3):not([colspan]) { display: none; }
  /* thread list rows: keep status + title (+ author line); hide counts and last post */
  table.tborder:has(tr.inline_row) > tbody > tr > td:nth-child(n+4):not([colspan]) { display: none; }
  table.tborder td { white-space: normal !important; }
  .tborder .trow1 strong a, .tborder .trow2 strong a { overflow-wrap: anywhere; }
  .post .post_author .author_statistics { text-align: left; flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 2px 12px; }
  .post .post_author .author_statistics br { display: none; }
  .post .post_controls { flex-direction: column; }
}
/* phones: multi-column forms (registration, profile editing, etc.) become one column */
@media (max-width: 760px) {
  /* only the registration form's two big columns stack; small label/field pairs inside stay intact */
  form:has(input[name="action"][value="do_register"]) table.tborder > tbody > tr > td { display: block; width: 100% !important; box-sizing: border-box; }
  form:has(input[name="action"][value="do_register"]) table.tborder table { width: 100% !important; }
  table.tborder td, table.tborder th { min-width: 0; overflow-wrap: anywhere; }
  table.tborder input.textbox, table.tborder input[type="text"], table.tborder input[type="password"],
  table.tborder input[type="email"], table.tborder select, table.tborder textarea, .select2-container { max-width: 100%; box-sizing: border-box; }
  form:has(input[name="action"][value="do_register"]) table.tborder input.textbox,
  form:has(input[name="action"][value="do_register"]) table.tborder select { width: 100% !important; }
  fieldset { min-width: 0; max-width: 100%; box-sizing: border-box; }
  .sceditor-container { width: 100% !important; }
  .sceditor-toolbar { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .sceditor-toolbar::-webkit-scrollbar { display: none; }
  .sceditor-group { flex: none; }
}
@media (max-width: 560px) {
  body { font-size: 15px !important; }
  #panel .upper .welcome { flex-basis: 100%; }
  #panel .upper form { flex-basis: 100%; }
  #search { width: 100%; } #search input.textbox { flex: 1; width: auto; }
  .post .post_author .author_information { flex-basis: calc(100% - 70px); }
  .tborder .trow1, .tborder .trow2 { padding: 12px !important; }
}
