@import url('https://fonts.googleapis.com/css2?family=VT323&family=Space+Mono:wght@400;700&display=swap');

/* =================================================
   EUROTRASH · phpBB theme · DARK BRUSHED METAL
   Matches eurotrash.com site aesthetic
   ================================================= */

:root {
  --bg:        #050505;
  --bg-1:      #0f0f0f;
  --bg-2:      #1a1a1a;
  --bg-3:      #2a2a2a;
  --bg-card:   #0a0a0a;
  --bg-sub:    #0a0a0a;
  --bg-head:   #000;
  --line:      #2a2a2a;
  --line-soft: #242424;
  --line-dash: #3a3a3a;
  --fg:        #f0f0f0;
  --fg-mute:   #b8b8b8;
  --fg-dim:    #8a8a8a;
  --accent:    #fff;
  --hover:     #1a1a1a;
}

html, body, body#phpbb {
  background: var(--bg) !important;
  color: var(--fg) !important;
  font-family: 'Space Mono', 'Courier New', Courier, monospace !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  -webkit-font-smoothing: antialiased !important;
  letter-spacing: 0 !important;
}

body#phpbb { padding: 0 !important; }

#wrap {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 16px !important;
  background: transparent !important;
}

/* ---------- links ---------- */
a, a:link, a:visited {
  color: var(--fg) !important;
  text-decoration: none !important;
  background: transparent !important;
}
a:hover, a:active {
  color: var(--accent) !important;
  text-decoration: underline !important;
}

/* ---------- header strip ---------- */
#site-header, .headerbar {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  margin: 0 0 10px 0 !important;
  padding: 14px 18px !important;
  box-shadow: none !important;
  color: var(--fg) !important;
  min-height: 0 !important;
}
.headerbar:before, .headerbar:after,
#site-header:before, #site-header:after { display: none !important; }
#logo, .site_logo { display: none !important; }
.site-description {
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  color: var(--fg) !important;
}
.site-description h1 {
  font-family: 'VT323', 'Courier New', monospace !important;
  font-size: 36px !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: lowercase !important;
  color: var(--fg) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-shadow: none !important;
  line-height: 1 !important;
}
.site-description h1 a { color: var(--fg) !important; text-decoration: none !important; }
.site-description p {
  font-family: 'Space Mono', monospace !important;
  font-size: 11px !important;
  color: var(--fg-dim) !important;
  margin: 4px 0 0 0 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.06em !important;
}

/* search in header */
.search-header { top: auto !important; margin-top: 0 !important; }
#search-box, .search-box {
  background: var(--bg-head) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
#keywords {
  border: 0 !important;
  padding: 4px 8px !important;
  height: auto !important;
  background: transparent !important;
  color: var(--fg) !important;
  font-family: 'Space Mono', monospace !important;
}
.search-box button {
  background: var(--bg-head) !important;
  border: 0 !important;
  border-left: 1px solid var(--line) !important;
  color: var(--fg-mute) !important;
}

/* ---------- nav bars ---------- */
.navbar, .nav-main, #nav-main {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  margin: 0 0 10px 0 !important;
  padding: 4px 12px !important;
  box-shadow: none !important;
  color: var(--fg) !important;
  min-height: 0 !important;
}
.navbar ul li, .nav-main ul li { background: transparent !important; }
.navbar a, .nav-main a, .linklist li a {
  color: var(--fg-mute) !important;
  text-decoration: none !important;
  text-transform: lowercase !important;
  padding: 4px 8px !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
}
.navbar a:hover, .nav-main a:hover, .linklist li a:hover {
  color: var(--accent) !important;
  text-decoration: none !important;
  background: var(--hover) !important;
}

/* breadcrumb */
.linklist.navlinks {
  background: transparent !important;
  border: 0 !important;
  padding: 4px 0 !important;
}

/* ---------- box: forum list (.forabg / .forumbg) ---------- */
.forabg, .forumbg {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.forabg .inner, .forumbg .inner {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
}

ul.topiclist {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* header row inside .forabg */
ul.topiclist li.header {
  background: var(--bg-head) !important;
  background-image: none !important;
  padding: 0 12px !important;
  height: 28px !important;
  line-height: 28px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  text-shadow: none !important;
}
ul.topiclist li.header dl { height: 28px !important; min-height: 0 !important; }
ul.topiclist li.header dt,
ul.topiclist li.header dd,
ul.topiclist li.header dt a,
ul.topiclist li.header dd a {
  color: #c8c8c8 !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  font-family: 'Space Mono', monospace !important;
}

/* row in forum/topic list */
ul.topiclist li.row {
  background: var(--bg-card) !important;
  border-top: 1px dashed var(--line-soft) !important;
  padding: 8px 12px !important;
  min-height: 0 !important;
}
ul.topiclist li.row:first-child { border-top: 0 !important; }
ul.topiclist li.row:hover { background: var(--bg-1) !important; }
ul.topiclist li.row dl dt,
ul.topiclist li.row dl dd,
ul.topiclist li.row dl {
  color: var(--fg) !important;
}
ul.topiclist li.row dl dd.lastpost,
ul.topiclist li.row dl dd.posts,
ul.topiclist li.row dl dd.topics {
  color: var(--fg-mute) !important;
  font-size: 11px !important;
}

ul.topiclist li.row dl dt a.forumtitle,
ul.topiclist li.row dl dt a.topictitle {
  color: var(--fg) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  font-family: 'Space Mono', monospace !important;
}
ul.topiclist li.row dl dt a.forumtitle:hover,
ul.topiclist li.row dl dt a.topictitle:hover {
  color: var(--accent) !important;
  text-decoration: underline !important;
}

/* forum description text under the title */
ul.topiclist li.row dl dt .list-inner {
  color: var(--fg-mute) !important;
}

/* ---------- icons: neutralize phpBB sprite, keep row intact ---------- */
dl.row-item,
dl.row-item.forum_read, dl.row-item.forum_unread,
dl.row-item.forum_read_locked, dl.row-item.forum_unread_locked,
dl.row-item.forum_read_subforum, dl.row-item.forum_unread_subforum,
dl.row-item.topic_read, dl.row-item.topic_unread,
dl.row-item.topic_read_hot, dl.row-item.topic_unread_hot,
dl.row-item.topic_read_locked, dl.row-item.topic_unread_locked,
dl.row-item.sticky_read, dl.row-item.sticky_unread,
dl.row-item.announce_read, dl.row-item.announce_unread {
  background-image: none !important;
  padding-left: 26px !important;
  position: relative !important;
  min-height: auto !important;
  width: auto !important;
  height: auto !important;
}
/* tiny square dot as unread indicator */
dl.row-item::before {
  content: '';
  position: absolute;
  left: 6px;
  top: 12px;
  width: 8px;
  height: 8px;
  border: 1px solid var(--line);
  background: transparent;
}
dl.row-item.forum_unread::before,
dl.row-item.topic_unread::before,
dl.row-item.topic_unread_hot::before,
dl.row-item.sticky_unread::before,
dl.row-item.announce_unread::before,
dl.row-item.forum_unread_locked::before,
dl.row-item.topic_unread_locked::before {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
}

/* ---------- stat blocks / panel cards ---------- */
.stat-block, .panel {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 0 10px 0 !important;
  box-shadow: none !important;
  color: var(--fg) !important;
}
.stat-block h3, .panel h3 {
  background: var(--bg-head) !important;
  color: #c8c8c8 !important;
  padding: 0 12px !important;
  margin: 0 !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 400 !important;
  height: 28px !important;
  line-height: 28px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  font-family: 'Space Mono', monospace !important;
}
.stat-block > div, .stat-block > p, .panel > div, .panel > p {
  padding: 12px 16px !important;
}
.stat-block + .stat-block, .stat-block p { margin: 0 !important; }
.stat-block p, .panel p { color: var(--fg) !important; font-size: 12px !important; }

/* ---------- action bars (above/below forum lists) ---------- */
.action-bar, .action-bar.bar-top, .action-bar.bar-bottom {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 6px 12px !important;
  margin: 0 0 10px 0 !important;
  color: var(--fg-mute) !important;
  font-size: 12px !important;
}

/* ---------- post view (topic content) ---------- */
.post {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 0 10px 0 !important;
  box-shadow: none !important;
}
.post .inner { padding: 0 !important; border: 0 !important; background: transparent !important; }
.post .postbody { padding: 14px 16px !important; color: var(--fg) !important; }
.post .postprofile {
  background: var(--bg-sub) !important;
  border: 0 !important;
  border-right: 1px solid var(--line) !important;
  padding: 14px !important;
  color: var(--fg-mute) !important;
  font-size: 11px !important;
}
.post .postprofile dt, .post .postprofile dd {
  color: var(--fg-mute) !important;
}
.post .postprofile .username,
.post .postprofile a {
  color: var(--fg) !important;
  font-weight: 700 !important;
}
.post h3, .post .author {
  font-size: 12px !important;
  font-family: 'Space Mono', monospace !important;
  color: var(--fg-mute) !important;
  border-bottom: 1px dashed var(--line-soft) !important;
  padding-bottom: 6px !important;
  margin-bottom: 10px !important;
  text-transform: none !important;
}
.post h3 a, .post .author a { color: var(--fg) !important; }
.postbody .content {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--fg) !important;
}

/* signature */
.signature {
  border-top: 1px dashed var(--line-soft) !important;
  color: var(--fg-dim) !important;
  font-size: 11px !important;
  padding-top: 8px !important;
  margin-top: 12px !important;
}

/* ---------- buttons ---------- */
.button, input.button1, input.button2, input.button3, a.button,
button.button, .buttons a, a.button.button-primary,
input[type="submit"], input[type="button"], input[type="reset"] {
  background: var(--bg-head) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  color: var(--fg) !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.06em !important;
  padding: 7px 16px !important;
  box-shadow: none !important;
  text-shadow: none !important;
  cursor: pointer !important;
  line-height: 1 !important;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease !important;
}
.button:hover, input.button1:hover, input.button2:hover, a.button:hover,
button.button:hover, input[type="submit"]:hover,
input[type="button"]:hover, input[type="reset"]:hover {
  background: var(--accent) !important;
  color: #000 !important;
  border-color: var(--accent) !important;
  text-decoration: none !important;
}
.button-icon-only { padding: 6px !important; }

/* ---------- form inputs ---------- */
input[type="text"], input[type="password"], input[type="email"],
input[type="search"], input[type="url"], input[type="number"],
input[type="tel"], textarea, select {
  background: var(--bg-head) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 7px 10px !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 12px !important;
  color: var(--fg) !important;
  box-shadow: none !important;
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
  outline: 0 !important;
  border-color: var(--fg-dim) !important;
}
fieldset, fieldset.fields1, fieldset.fields2 {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 12px !important;
  margin: 0 0 10px 0 !important;
  box-shadow: none !important;
  color: var(--fg) !important;
}
legend {
  padding: 0 6px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  color: var(--fg-mute) !important;
}

/* labels */
label, dt label { color: var(--fg-mute) !important; }

/* ---------- footer ---------- */
#page-footer {
  background: var(--bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 10px 14px !important;
  color: var(--fg-dim) !important;
  text-shadow: none !important;
  margin-top: 12px !important;
}
.copyright {
  border: 0 !important;
  background: transparent !important;
  font-size: 10px !important;
  text-align: center !important;
  color: var(--fg-dim) !important;
  font-family: 'Space Mono', monospace !important;
  letter-spacing: 0.04em !important;
  padding-top: 8px !important;
}
.copyright a { color: var(--fg-mute) !important; }

/* ---------- tables inside posts ---------- */
table { border-collapse: collapse !important; }
table th {
  background: var(--bg-head) !important;
  color: #c8c8c8 !important;
  padding: 6px 10px !important;
  text-align: left !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  font-family: 'Space Mono', monospace !important;
  border-bottom: 1px solid var(--line) !important;
}
table td {
  border-bottom: 1px dashed var(--line-soft) !important;
  padding: 6px 10px !important;
  color: var(--fg) !important;
  font-size: 12px !important;
}

/* ---------- misc ---------- */
hr {
  border: 0 !important;
  border-top: 1px dashed var(--line-soft) !important;
  margin: 12px 0 !important;
}
* { border-radius: 0 !important; }
[style*="linear-gradient"], [style*="radial-gradient"] { background-image: none !important; }

/* scrollbars (webkit) */
::-webkit-scrollbar { width: 10px; height: 10px; background: var(--bg-1); }
::-webkit-scrollbar-thumb { background: var(--bg-3); border: 1px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--line); }

/* text selection */
::selection { background: var(--accent); color: #000; }
::-moz-selection { background: var(--accent); color: #000; }

/* highlights / errors / successes */
.error, .errorbox {
  background: #1a0505 !important;
  border: 1px solid #4a1a1a !important;
  color: #ff9a9a !important;
  border-radius: 0 !important;
}
.successbox {
  background: #051a05 !important;
  border: 1px solid #1a4a1a !important;
  color: #9affa6 !important;
  border-radius: 0 !important;
}
.warningbox, .rules {
  background: var(--bg-card) !important;
  border: 1px solid var(--line) !important;
  color: var(--fg-mute) !important;
  border-radius: 0 !important;
}

/* code blocks */
pre, .codebox {
  background: var(--bg-head) !important;
  border: 1px solid var(--line) !important;
  color: var(--fg) !important;
  font-family: 'Space Mono', monospace !important;
  padding: 10px !important;
  border-radius: 0 !important;
}

/* dropdowns (e.g. user menu) */
.dropdown, .dropdown-container {
  background: var(--bg-card) !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
  color: var(--fg) !important;
  border-radius: 0 !important;
}
.dropdown .header, .dropdown-contents {
  background: var(--bg-head) !important;
  color: var(--fg-mute) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
.dropdown-contents li, .dropdown-contents a {
  color: var(--fg) !important;
  background: transparent !important;
}
.dropdown-contents li:hover, .dropdown-contents a:hover {
  background: var(--hover) !important;
  color: var(--accent) !important;
}

/* notifications dot */
.badge { background: var(--accent) !important; color: #000 !important; }

/* pagination */
.pagination li a, .pagination li span {
  background: var(--bg-head) !important;
  border: 1px solid var(--line) !important;
  color: var(--fg) !important;
  border-radius: 0 !important;
  padding: 4px 8px !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 11px !important;
}
.pagination li.active span {
  background: var(--accent) !important;
  color: #000 !important;
  border-color: var(--accent) !important;
}

/* =================================================
   EMBED MODE — stricter cleanup (v2)
   ================================================= */
html.et-embed body#phpbb {
  background: var(--bg) !important;
}
html.et-embed #wrap {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
html.et-embed #site-header,
html.et-embed .headerbar,
html.et-embed .search-header,
html.et-embed #search-header,
html.et-embed .navbar,
html.et-embed #nav-main,
html.et-embed .nav-main,
html.et-embed .linklist.navlinks,
html.et-embed #page-header .navbar,
html.et-embed #page-header {
  display: none !important;
}
html.et-embed #page-body { padding: 0 !important; margin: 0 !important; }
html.et-embed #page-footer {
  display: none !important;
}

/* override Shopify eurotrash.css body flex that breaks phpBB vertical layout */
html.et-embed body#phpbb {
  display: block !important;
}

/* our custom index container — give it breathing room in full width */
html.et-embed .et-forum {
  max-width: 1800px !important;
  padding: 18px 24px 60px !important;
  margin: 0 auto !important;
}

/* =================================================
   FINAL POLISH — align every segment to mock
   ================================================= */

/* box heads: label must sit LEFT, optional actions RIGHT */
html.et-embed .et-box__head {
  justify-content: flex-start !important;
  text-align: left !important;
}
html.et-embed .et-box__head > span:first-child {
  order: 0 !important;
  margin-right: auto !important;
}

/* stats row at top: compact, right-aligned, muted */
html.et-embed .et-forum__stats {
  flex: 0 0 auto !important;
  max-width: 380px !important;
  text-align: right !important;
  font-size: 11px !important;
  color: #8a8a8a !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 6px !important;
}
html.et-embed .et-forum__stats span { white-space: nowrap; }
html.et-embed .et-forum__stats strong,
html.et-embed .et-forum__stats b {
  color: #fff !important;
  font-weight: 400 !important;
}

/* crumbs on the left compact */
html.et-embed .et-forum__crumbs { font-size: 11px; flex: 0 0 auto; }
html.et-embed .et-forum__crumbs a { color: #b8b8b8 !important; }
html.et-embed .et-forum__crumbs span { color: #555; }

/* cats tabs centered, keep in one line, strong active */
html.et-embed .et-forum__cats-tabs {
  flex: 1 1 auto !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
html.et-embed .et-forum__cats-tabs a {
  border: 1px solid transparent !important;
  padding: 2px 10px !important;
  color: #b8b8b8 !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
}
html.et-embed .et-forum__cats-tabs a:hover {
  background: var(--bg-2) !important;
  color: #fff !important;
  text-decoration: none !important;
}
html.et-embed .et-forum__cats-tabs a.active {
  border-color: var(--line) !important;
  background: var(--bg-2) !important;
  color: #fff !important;
}

/* feed cards: compact + clean */
html.et-embed .et-fpost__head {
  padding: 10px 14px !important;
}
html.et-embed .et-fpost__head .et-fuser__avatar {
  width: 36px !important;
  height: 36px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #002a5c !important;
  background: linear-gradient(135deg, #eaf5ff 0%, #9fc9ed 45%, #2e6da6 100%) !important;
}
html.et-embed .et-fpost__head .et-fuser__name {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #fff !important;
}
html.et-embed .et-fpost__head .et-fuser__name a {
  color: #fff !important;
  text-decoration: none !important;
}
html.et-embed .et-fpost__head .et-fuser__name a:hover {
  text-decoration: underline !important;
}
html.et-embed .et-fpost__head .et-fuser__meta {
  color: #8a8a8a !important;
  font-size: 11px !important;
  margin-top: 2px !important;
}
html.et-embed .et-fpost__opts {
  font-size: 11px !important;
  color: #8a8a8a !important;
  gap: 14px !important;
}
html.et-embed .et-fpost__opts span { cursor: default; }
html.et-embed .et-fpost__opts b { color: #fff !important; font-weight: 400 !important; }

/* body (last post or no-posts): subtle */
html.et-embed .et-fpost__body {
  padding: 10px 14px !important;
  background: var(--bg-card) !important;
  font-size: 12px !important;
}
html.et-embed .et-fpost__body p { margin: 0; color: #b8b8b8; }
html.et-embed .et-fpost__body a { color: #f0f0f0 !important; }

/* reactions row: used as action bar for "enter thread" / "+ new" */
html.et-embed .et-fpost__reactions {
  padding: 8px 14px !important;
  background: var(--bg-sub) !important;
  gap: 6px !important;
}
html.et-embed .et-fpost__reactions .rx {
  padding: 4px 12px !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
  text-decoration: none !important;
}

/* right sidebar stats rows */
html.et-embed .et-box__body p { margin: 0 0 4px !important; font-size: 12px; color: #f0f0f0; }
html.et-embed .et-box__body p strong { color: #fff; font-weight: 700; }

/* inputs inside quick login box */
html.et-embed .et-box .et-input {
  width: 100% !important;
  background: var(--bg-head) !important;
  border: 1px solid var(--line) !important;
  color: var(--fg) !important;
  padding: 7px 10px !important;
  font-family: Space Mono, monospace !important;
  font-size: 12px !important;
}
html.et-embed .et-box .et-btn--block {
  width: 100% !important;
  text-align: center !important;
  justify-content: center !important;
}

/* dashed divider inside boxes */
html.et-embed .et-hr-dash {
  border: 0 !important;
  border-top: 1px dashed var(--line-soft) !important;
  margin: 10px 0 !important;
}

/* tighter forum-layout gap on narrower viewports */
@media (max-width: 1200px) {
  html.et-embed .et-forum__layout { grid-template-columns: 220px 1fr 220px !important; gap: 14px !important; }
}
@media (max-width: 900px) {
  html.et-embed .et-forum__layout { grid-template-columns: 1fr !important; }
  html.et-embed .et-forum__bar { flex-direction: column; align-items: stretch; }
  html.et-embed .et-forum__stats { justify-content: flex-start !important; text-align: left !important; }
}