/* ==========================================================================
   GOTTI RP — Invision Focus-style board (from Eclipse forums.html reference)
   Layout: section title bars + flex forum rows (icon | main | stats | last)
   Palette: Focus dark (#0f0f0f / #232323 / #3e3e3e) + Gotti gold/burgundy accents
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --ips-page: #0f0f0f;
  --ips-header: #0f0f0f;
  --ips-nav: #0f0f0f;
  --ips-box: #232323;
  --ips-row: #232323;
  --ips-row-alt: #2b2b2b;
  --ips-row-hover: #303030;
  --ips-section: #303030;
  --ips-section-font: #ffffff;
  --ips-text: #bfbfbf;
  --ips-text-dark: #e3e3e3;
  --ips-text-light: #878787;
  --ips-link: #ededed;
  --ips-link-hover: #ffffff;
  --ips-border: rgba(255, 255, 255, 0.08);
  --ips-border-strong: rgba(255, 255, 255, 0.12);
  --gotti-gold: #c9a227;
  --gotti-gold-bright: #e4c45a;
  --gotti-burgundy: #6b0f1a;
  --gotti-burgundy-hot: #8e1422;
  --sp: 12px;
  --radius: 4px;
  --maxw: 1200px;
}

/* ---- Base (Focus dark) ---- */
html {
  background: var(--ips-page) !important;
  color-scheme: dark;
}

html, body, body#phpbb {
  background:
    radial-gradient(ellipse 120% 70% at 50% -5%, rgba(107, 15, 26, 0.55), transparent 55%),
    radial-gradient(ellipse 80% 50% at 50% 35%, rgba(90, 12, 22, 0.22), transparent 60%),
    linear-gradient(180deg, #1a0a0e 0%, #0f0a0c 28%, #0a080a 55%, #08070a 100%) !important;
  background-attachment: fixed !important;
  color: var(--ips-text) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  min-height: 100% !important;
}

h1, h2, h3 {
  font-family: Inter, sans-serif !important;
  font-weight: 600 !important;
  color: var(--ips-text-dark) !important;
  text-shadow: none !important;
}

a, a:link, a:visited { color: var(--ips-link) !important; text-decoration: none !important; }
a:hover { color: var(--ips-link-hover) !important; }

/* ---- Shell: full width dark, content max-width ---- */
.wrap {
  max-width: var(--maxw) !important;
  margin: 0 auto !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 12px 40px !important;
  overflow: visible !important;
}


/* ---- Header (gold masthead; blends into page gradient) ---- */
#page-header {
  background: transparent !important;
  margin: 0 -12px 0 !important;
  padding: 0 12px !important;
  border-bottom: 1px solid rgba(201, 162, 39, 0.22) !important;
  box-shadow: none !important;
}

.headerbar,
#page-header .headerbar {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 auto !important;
  max-width: var(--maxw) !important;
  padding: 28px 0 20px !important;
  box-shadow: none !important;
  color: #f3e9d7 !important;
  text-align: center !important;
}

.site_logo, .logo .site_logo { display: none !important; }
.logo { display: block !important; float: none !important; margin: 0 auto !important; }

#site-description {
  float: none !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 4px 12px !important;
}

#site-description h1,
.headerbar h1 {
  font-family: "Cinzel", Georgia, "Times New Roman", serif !important;
  font-size: 1.85rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #c9a227 !important;
  text-shadow: 0 0 32px rgba(201, 162, 39, 0.4), 0 2px 0 rgba(0,0,0,0.55) !important;
  margin: 0 !important;
  line-height: 1.25 !important;
}

#site-description h1::after {
  content: "" !important;
  display: block !important;
  width: 88px !important;
  height: 2px !important;
  margin: 12px auto 0 !important;
  background: linear-gradient(90deg, transparent, #c9a227, transparent) !important;
}

#site-description p {
  color: #a89b8c !important;
  font-family: Inter, sans-serif !important;
  font-size: 0.82rem !important;
  margin: 10px 0 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
}
#site-description p.skiplink { display: none !important; }

/* Hide stock header search (nav has full search bar) */
#search-box.search-header { display: none !important; }

/* ---- Navbars ---- */
.navbar {
  background: var(--ips-nav) !important;
  background-image: none !important;
  border: none !important;
  border-bottom: 1px solid var(--ips-border) !important;
  border-radius: 0 !important;
  margin: 0 -12px 16px !important;
  padding: 10px 24px !important;
  box-shadow: none !important;
  min-height: 0 !important;
}

.navbar a,
.linklist a,
.breadcrumbs a {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.navbar a:hover,
.linklist a:hover,
.breadcrumbs a:hover {
  color: #fff !important;
}

/* =========================================================
   INDEX: Invision-style category blocks
   ========================================================= */

/* Outer category box = ipsBox / cForumList section */
.forabg,
.forumbg {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 0 28px 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.forabg .inner,
.forumbg .inner {
  background: transparent !important;
}

/* Category header = ipsType_sectionTitle / cForumTitle */
ul.topiclist {
  background: transparent !important;
  border: none !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}

/* Kill stock header column labels row styling */
ul.topiclist:first-child li.header {
  display: block !important;
  background: var(--ips-section) !important;
  background-image: none !important;
  border: none !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  padding: 12px 16px !important;
  margin: 0 !important;
  min-height: 0 !important;
}

/* Hide Topics / Posts / Last post column headers — IPS doesn't show them */
ul.topiclist:first-child li.header dd {
  display: none !important;
}

ul.topiclist:first-child li.header dt {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

ul.topiclist:first-child li.header dt .list-inner,
ul.topiclist:first-child li.header a,
ul.topiclist:first-child li.header dt {
  color: var(--ips-section-font) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
  font-family: Inter, sans-serif !important;
  line-height: 1.3 !important;
}

/* Gold accent bar on category title (Gotti identity on Eclipse layout) */
ul.topiclist:first-child li.header {
  border-left: 3px solid var(--gotti-gold) !important;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
}

/* Forum rows list = ipsDataList inside box */
ul.topiclist.forums {
  background: var(--ips-box) !important;
  border: 1px solid var(--ips-border) !important;
  border-top: none !important;
  border-radius: 0 0 var(--radius) var(--radius) !important;
  overflow: hidden !important;
}

/* Each forum = cForumRow ipsDataItem flex */
ul.topiclist.forums li.row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  background: var(--ips-row) !important;
  border: none !important;
  border-top: 1px solid var(--ips-border) !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 72px !important;
  list-style: none !important;
  transition: background 0.12s ease;
}

ul.topiclist.forums li.row:first-child {
  border-top: none !important;
}

ul.topiclist.forums li.row:nth-child(even) {
  background: var(--ips-row-alt) !important;
}

ul.topiclist.forums li.row:hover {
  background: var(--ips-row-hover) !important;
}

/* Neutralize stock dl float layout */
ul.topiclist.forums li.row dl.row-item {
  display: contents !important; /* children become flex items of li.row */
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
}

/* Icon column */
ul.topiclist.forums li.row dt {
  order: 1;
  flex: 0 0 64px !important;
  width: 64px !important;
  max-width: 64px !important;
  min-width: 64px !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 8px 12px 14px !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
  background-image: none !important !important;
}

/* Hide prosilver folder sprites; show a clean status pip */
ul.topiclist.forums li.row dt::before {
  content: "" !important;
  display: block !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 4px !important;
  background: linear-gradient(145deg, var(--gotti-burgundy-hot), var(--gotti-burgundy)) !important;
  box-shadow: inset 0 0 0 1px rgba(201, 162, 39, 0.25) !important;
  opacity: 0.85 !important;
}

ul.topiclist.forums li.row.bg1 dt::before,
ul.topiclist.forums li.row:nth-child(odd) dt::before {
  opacity: 0.75 !important;
}

/* Unread = brighter gold edge */
ul.topiclist.forums li.row dt a.row-item-link + .list-inner ~ * ,
ul.topiclist.forums li.row dt[title*="Unread"]::before {
  box-shadow: inset 0 0 0 1px var(--gotti-gold), 0 0 10px rgba(201, 162, 39, 0.25) !important;
}

ul.topiclist.forums li.row dt .list-inner {
  /* main content will be repositioned */
}

/* Move list-inner (title+desc) to main column via grid on dt - actually structure is:
   dt contains list-inner with title. dd.topics, dd.posts, dd.lastpost siblings.
   With display:contents on dl, order: dt, dd.topics, dd.posts, dd.lastpost
   We need title as flex grow - so restructure with CSS:
*/

/* Main column: title + description */
ul.topiclist.forums li.row dt .list-inner {
  position: absolute !important;
  left: 64px !important;
  right: 340px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: auto !important;
  padding: 10px 16px 10px 8px !important;
  margin: 0 !important;
  text-align: left !important;
}

ul.topiclist.forums li.row {
  position: relative !important;
}

a.forumtitle {
  color: var(--ips-text-dark) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.3 !important;
  display: inline-block !important;
  margin-bottom: 2px !important;
}

a.forumtitle:hover {
  color: #fff !important;
}

/* Description text after <br /> */
ul.topiclist.forums li.row dt .list-inner {
  color: var(--ips-text-light) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}

/* Stats columns = ipsDataItem_stats */
ul.topiclist.forums li.row dd.topics,
ul.topiclist.forums li.row dd.posts {
  order: 3;
  flex: 0 0 70px !important;
  width: 70px !important;
  min-width: 70px !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 4px !important;
  margin: 0 !important;
  border: none !important;
  border-left: 1px solid var(--ips-border) !important;
  background: transparent !important;
  color: var(--ips-text-light) !important;
  font-size: 11px !important;
  text-align: center !important;
  line-height: 1.2 !important;
}

ul.topiclist.forums li.row dd.topics {
  order: 2;
  margin-left: auto !important; /* push stats+last to the right of absolute main */
}

/* Number styling */
ul.topiclist.forums li.row dd.topics,
ul.topiclist.forums li.row dd.posts {
  font-size: 0 !important; /* hide raw, rebuild */
}

ul.topiclist.forums li.row dd.topics::before,
ul.topiclist.forums li.row dd.posts::before {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--ips-text-dark) !important;
  display: block !important;
  margin-bottom: 2px !important;
  content: attr(data-count) !important;
}

/* phpBB puts number as text node — use dfn labels */
ul.topiclist.forums li.row dd.topics,
ul.topiclist.forums li.row dd.posts {
  font-size: 12px !important;
  color: var(--ips-text-light) !important;
}

ul.topiclist.forums li.row dd.topics dfn,
ul.topiclist.forums li.row dd.posts dfn {
  display: block !important;
  font-style: normal !important;
  font-size: 11px !important;
  color: var(--ips-text-light) !important;
  text-transform: lowercase !important;
}

/* Make the number stand out - first text is the number in prosilver */
ul.topiclist.forums li.row dd.topics,
ul.topiclist.forums li.row dd.posts {
  font-weight: 400 !important;
}

/* Last post column = ipsDataItem_lastPoster */
ul.topiclist.forums li.row dd.lastpost {
  order: 4;
  flex: 0 0 200px !important;
  width: 200px !important;
  min-width: 180px !important;
  max-width: 220px !important;
  float: none !important;
  display: block !important;
  padding: 10px 14px 10px 12px !important;
  margin: 0 !important;
  border: none !important;
  border-left: 1px solid var(--ips-border) !important;
  background: transparent !important;
  color: var(--ips-text-light) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

ul.topiclist.forums li.row dd.lastpost span {
  display: block !important;
}

ul.topiclist.forums li.row dd.lastpost dfn {
  display: none !important; /* hide "Last post" label like IPS */
}

ul.topiclist.forums li.row dd.lastpost a.lastsubject,
ul.topiclist.forums li.row dd.lastpost a {
  color: var(--ips-text-dark) !important;
  font-weight: 500 !important;
  font-size: 12.5px !important;
}

ul.topiclist.forums li.row dd.lastpost a:hover {
  color: #fff !important;
}

ul.topiclist.forums li.row dd.lastpost time {
  color: var(--ips-text-light) !important;
  font-size: 11.5px !important;
}

ul.topiclist.forums li.row dd.redirect {
  margin-left: auto !important;
  border-left: 1px solid var(--ips-border) !important;
  padding: 12px 16px !important;
  color: var(--ips-text-light) !important;
}

/* Hide stock bg images on dt */
ul.topiclist.forums li.row dl {
  background-image: none !important;
}
ul.topiclist.forums li.row dt {
  background-image: none !important;
}

.forum-image img {
  width: 36px !important;
  height: 36px !important;
  border-radius: 4px !important;
  object-fit: cover !important;
}

/* When forum image present, hide pseudo icon */
ul.topiclist.forums li.row dt:has(.forum-image)::before {
  display: none !important;
}

/* ---- Topic lists inside a forum (forumbg) ---- */
.forumbg ul.topiclist.topics li.row {
  display: flex !important;
  align-items: center !important;
  background: var(--ips-row) !important;
  border-top: 1px solid var(--ips-border) !important;
  min-height: 56px !important;
}

.forumbg ul.topiclist.topics li.row:nth-child(even) {
  background: var(--ips-row-alt) !important;
}

.forumbg ul.topiclist li.header {
  background: var(--ips-section) !important;
  background-image: none !important;
  border-left: 3px solid var(--gotti-gold) !important;
}

a.topictitle {
  color: var(--ips-text-dark) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

a.topictitle:hover { color: #fff !important; }

/* ---- Panels / posts ---- */
.panel, .bg1, .bg2, .bg3 {
  background: var(--ips-box) !important;
  background-image: none !important;
  color: var(--ips-text) !important;
  border: 1px solid var(--ips-border) !important;
  border-radius: var(--radius) !important;
}

.post {
  background: var(--ips-box) !important;
  border: 1px solid var(--ips-border) !important;
  border-radius: var(--radius) !important;
  margin-bottom: 10px !important;
}

.postbody, .postbody .content, .content {
  color: var(--ips-text) !important;
}

.postprofile {
  color: var(--ips-text-light) !important;
  border-color: var(--ips-border) !important;
}

/* ---- Buttons ---- */
.button, a.button, a.button1, a.button2,
input.button1, input.button2, button.button {
  background: #353535 !important;
  background-image: none !important;
  border: 1px solid var(--ips-border-strong) !important;
  color: #ddd !important;
  border-radius: 4px !important;
  text-shadow: none !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}

a.button1, input.button1, .button1 {
  background: var(--gotti-burgundy) !important;
  border-color: rgba(201, 162, 39, 0.35) !important;
  color: #fff !important;
}

/* ---- Forms ---- */
input.inputbox, textarea.inputbox, select, .inputbox,
input[type="text"], input[type="password"], input[type="email"], input[type="search"] {
  background: #232323 !important;
  border: 1px solid var(--ips-border-strong) !important;
  color: var(--ips-text-dark) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

/* ---- Stats / footer ---- */
.stat-block, .statistics {
  background: var(--ips-box) !important;
  border: 1px solid var(--ips-border) !important;
  border-radius: var(--radius) !important;
  color: var(--ips-text-light) !important;
  margin: 16px 0 !important;
  padding: 14px 16px !important;
  box-shadow: none !important;
}

.stat-block h3 {
  color: #fff !important;
  font-size: 14px !important;
  background: var(--ips-section) !important;
  margin: -14px -16px 12px !important;
  padding: 10px 16px !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  border-left: 3px solid var(--gotti-gold) !important;
}

.copyright, #page-footer, #nav-footer {
  background: transparent !important;
  color: var(--ips-text-light) !important;
  border: none !important;
}

.copyright a { color: var(--gotti-gold) !important; }

/* Dropdowns */
.dropdown-contents, .dropdown .dropdown-contents {
  background: #1a1a1a !important;
  border: 1px solid var(--ips-border-strong) !important;
  color: var(--ips-text) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}

/* Pagination */
.pagination li a, .pagination li span {
  background: #2a2a2a !important;
  border: 1px solid var(--ips-border) !important;
  color: var(--ips-text) !important;
  border-radius: 3px !important;
}
.pagination .active span {
  background: var(--gotti-burgundy) !important;
  border-color: var(--gotti-gold) !important;
  color: #fff !important;
}

/* Kill remaining prosilver gradients / blues */
.headerbar, .forumbg, .forabg, .navbar, .panel, .button,
ul.topiclist li.header, li.row dl {
  background-image: none !important;
}

/* Responsive */
@media (max-width: 850px) {
  ul.topiclist.forums li.row dt .list-inner {
    position: static !important;
    transform: none !important;
    left: auto !important;
    right: auto !important;
    padding: 8px 12px !important;
    flex: 1 1 auto !important;
  }
  ul.topiclist.forums li.row {
    flex-wrap: wrap !important;
    min-height: 0 !important;
  }
  ul.topiclist.forums li.row dt {
    flex: 0 0 52px !important;
  }
  ul.topiclist.forums li.row dd.topics,
  ul.topiclist.forums li.row dd.posts {
    display: none !important;
  }
  ul.topiclist.forums li.row dd.lastpost {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: none !important;
    border-left: none !important;
    border-top: 1px solid var(--ips-border) !important;
    padding-left: 64px !important;
  }
  #search-box.search-header {
    float: none !important;
    margin: 10px 0 0 !important;
  }
}

/* Links gold on hover for brand */
a.forumtitle:hover,
a.topictitle:hover,
a.lastsubject:hover {
  color: var(--gotti-gold-bright) !important;
}

/* Breadcrumb strip */
.navbar[role="navigation"] {
  background: #161616 !important;
}


/* =========================================================
   TWO-COLUMN INDEX + RIGHT SIDEBAR WIDGETS (Eclipse-style)
   ========================================================= */
.gotti-index {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  gap: 20px !important;
  align-items: start !important;
  margin-top: 8px !important;
}

.gotti-index__main {
  min-width: 0 !important;
}

.gotti-index__sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  position: sticky !important;
  top: 12px !important;
}

/* Widget cards = ipsWidget_vertical ipsBox */
.gotti-widget {
  background: var(--ips-box, #232323) !important;
  border: 1px solid var(--ips-border, rgba(255,255,255,0.08)) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
}

.gotti-widget--accent {
  border-color: rgba(201, 162, 39, 0.28) !important;
  box-shadow: 0 4px 20px rgba(107, 15, 26, 0.2) !important;
}

.gotti-widget__title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  background: #303030 !important;
  border: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  border-left: 3px solid #c9a227 !important;
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.3 !important;
}

.gotti-widget__title a,
.gotti-widget__title-link {
  color: rgba(255,255,255,0.55) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

.gotti-widget__title a:hover,
.gotti-widget__title-link:hover {
  color: #e4c45a !important;
}

.gotti-widget__body {
  padding: 12px 14px 14px !important;
  color: #bfbfbf !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.gotti-widget__body p {
  margin: 0 0 8px !important;
}

.gotti-widget__body p:last-child {
  margin-bottom: 0 !important;
}

.gotti-widget__muted {
  color: #878787 !important;
  font-size: 12.5px !important;
}

.gotti-welcome-lead {
  font-family: "Cinzel", Georgia, serif !important;
  color: #c9a227 !important;
  font-size: 1.05rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  margin-bottom: 4px !important;
}

.gotti-widget__links {
  list-style: none !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
}

.gotti-widget__links--stack {
  flex-direction: column !important;
  gap: 6px !important;
}

.gotti-widget__links a {
  color: #ededed !important;
  font-size: 13px !important;
}

.gotti-widget__links a:hover {
  color: #e4c45a !important;
}

.gotti-widget__meta {
  color: #e3e3e3 !important;
  font-weight: 500 !important;
}

.gotti-online-list {
  margin-top: 8px !important;
  color: #bfbfbf !important;
  font-size: 12.5px !important;
  line-height: 1.55 !important;
  word-break: break-word !important;
}

.gotti-online-list a {
  color: #ededed !important;
}

.gotti-stats {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.gotti-stats li {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 7px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

.gotti-stats li:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

.gotti-stats__label {
  color: #878787 !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.gotti-stats__value {
  color: #e3e3e3 !important;
  font-weight: 600 !important;
  text-align: right !important;
  font-size: 12.5px !important;
}

.gotti-stats__value a {
  color: #e4c45a !important;
}

/* Login form in main when guest */
.gotti-widget--login {
  margin-top: 16px !important;
}

/* Hide old bottom stat blocks if any leftover classes on other pages - index moved them */
.gotti-index__main > .stat-block {
  display: none !important;
}

@media (max-width: 980px) {
  .gotti-index {
    grid-template-columns: 1fr !important;
  }
  .gotti-index__sidebar {
    position: static !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }
}

@media (max-width: 640px) {
  .gotti-index__sidebar {
    grid-template-columns: 1fr !important;
  }
  #site-description h1,
  .headerbar h1 {
    font-size: 1.35rem !important;
    letter-spacing: 0.1em !important;
  }
}



/* =========================================================
   HEADER NAV + INLINE SEARCH BAR
   ========================================================= */
.gotti-navbar {
  background: rgba(12, 10, 12, 0.72) !important;
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(201, 162, 39, 0.15) !important;
  margin: 0 -12px 18px !important;
  padding: 0 !important;
}

.gotti-navbar__inner {
  max-width: var(--maxw) !important;
  margin: 0 auto !important;
  padding: 10px 8px 12px !important;
}

.gotti-nav-main {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 2px !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  list-style: none !important;
}

.gotti-nav-main > li {
  float: none !important;
  margin: 0 !important;
}

.gotti-nav-item > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  color: rgba(243, 233, 215, 0.78) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.gotti-nav-item > a:hover {
  color: #fff !important;
  background: rgba(201, 162, 39, 0.1) !important;
}

.gotti-nav-item--cta > a {
  background: rgba(107, 15, 26, 0.55) !important;
  border: 1px solid rgba(201, 162, 39, 0.3) !important;
  color: #f3e9d7 !important;
}

.gotti-nav-item--discord > a {
  background: rgba(88, 101, 242, 0.18) !important;
  border: 1px solid rgba(88, 101, 242, 0.35) !important;
  color: #e8e6ff !important;
}

.gotti-nav-main .rightside {
  margin-left: 0 !important;
  float: none !important;
}
/* Push only the first auth control right; keep Login + Register adjacent */
.gotti-nav-main > li.rightside:first-of-type {
  margin-left: auto !important;
}
.gotti-nav-main > li.rightside + li.rightside {
  margin-left: 6px !important;
}
.gotti-nav-main > li.rightside > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}
.gotti-nav-main > li.rightside > a[href*="mode=register"] {
  background: linear-gradient(180deg, #8e1422, #6b0f1a) !important;
  border: 1px solid rgba(201,162,39,0.35) !important;
  color: #f3e9d7 !important;
  font-weight: 600 !important;
}
.gotti-nav-main > li.rightside > a[href*="logout"],
.gotti-nav-main > li.rightside > a[href*="mode=login"] {
  border: 1px solid rgba(201,162,39,0.25) !important;
  background: rgba(30,24,34,0.85) !important;
}


/* Full search bar */
.gotti-searchbar {
  margin: 0 0 10px !important;
}

.gotti-searchbar form {
  display: flex !important;
  gap: 8px !important;
  align-items: stretch !important;
}

.gotti-searchbar__input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: 40px !important;
  padding: 0 16px !important;
  border-radius: 20px !important;
  background: rgba(8, 7, 10, 0.85) !important;
  border: 1px solid rgba(201, 162, 39, 0.28) !important;
  color: #f3e9d7 !important;
  font-size: 14px !important;
}

.gotti-searchbar__input::placeholder {
  color: #8a8074 !important;
}

.gotti-searchbar__btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 18px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(201, 162, 39, 0.4) !important;
  background: linear-gradient(180deg, #8e1422 0%, #6b0f1a 100%) !important;
  color: #f3e9d7 !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  cursor: pointer !important;
}

.gotti-searchbar__btn:hover {
  filter: brightness(1.08);
}

/* Active topics list */
.gotti-widget__body--flush {
  padding: 0 !important;
}

.gotti-topic {
  display: block !important;
  padding: 10px 14px !important;
  border-top: 1px solid rgba(255,255,255,0.05) !important;
  text-decoration: none !important;
  transition: background 0.12s ease;
}

.gotti-topic:first-child {
  border-top: none !important;
}

.gotti-topic:hover {
  background: rgba(201, 162, 39, 0.06) !important;
}

.gotti-topic__title {
  display: block !important;
  color: #e8edf5 !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  margin-bottom: 3px !important;
}

.gotti-topic:hover .gotti-topic__title {
  color: #e4c45a !important;
}

.gotti-topic__meta,
.gotti-topic__time {
  display: block !important;
  color: #878787 !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

.gotti-topic__meta a {
  color: #bfbfbf !important;
}

.gotti-widget__empty {
  padding: 12px 14px !important;
}

.gotti-widget--muted .gotti-widget__title {
  opacity: 0.9;
}

/* Transparent content shell so page gradient shows */
.wrap {
  background: transparent !important;
}

@media (max-width: 700px) {
  .gotti-searchbar form { flex-direction: column !important; }
  .gotti-nav-item--cta, .gotti-nav-item--discord { flex: 1 1 auto; }
}