/* BasilMarket classic-era faithful remake - 2008 layout modernized.
   Based on research/snapshots/basilmarket_2008.css (archived original).
   Layout: 1044px masthead with banner art, gray nav bar, 1024px body wrap,
   three columns (180 left / fluid center / 180 right). */

:root {
  --link: #F44E00;
  --link-hover: #222;
  --menu-bg: #424242;
  --module-head-bg: #e8e8e8;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0 0 10px 0;
  font-size: 13px;
  font-family: tahoma, verdana, arial, sans-serif;
  color: #333;
  text-align: center;
  background: #EFEEE7 url(/img/back-day.jpg) top repeat-x;
}

a, a:link, a:visited, a:active { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: none; }
/* visited recolor - content links only (nav/masthead live outside #bodyWrap).
   Deep burnt orange: clearly distinct from --link orange, stays era-appropriate. */
#bodyWrap a:visited { color: #7A2E00; }
#bodyWrap a:visited:hover { color: var(--link-hover); }
img { border: 0; max-width: 100%; }
form { margin: 0; padding: 0; }
div { padding: 0; text-align: left; font-size: 12px; }
table { font-size: 13px; font-family: tahoma, verdana, arial, sans-serif; border-collapse: collapse; }

/* ---------- masthead ---------- */
#day { text-align: center; }
#bodyWrapOuter { width: 100%; }

.innerWrap {
  width: 1044px; height: 79px;
  margin: 0 auto;
  border-bottom: 1px solid #777;
  position: relative;
  overflow: hidden;
}
/* faithful to original: mast art centered, wrap 79px = image height */
.innerWrapday { background: #fff url(/img/mast-back-day-fall2010.jpg) top center no-repeat; }
.innerWrapPP1 { float: left; padding: 0; width: 392px; height: 80px; }
.innerWrapPP2 { width: 249px; height: 80px; padding: 0; }
.mastBanner { position: absolute; top: 0; right: 0; width: 650px; height: 80px; }

/* ---------- nav menu ---------- */
.menuWrap {
  clear: both;
  width: 1042px;
  margin: 0 auto;
  padding: 0;
  background: var(--menu-bg);
  border-left: 1px solid #777;
  border-right: 1px solid #777;
  border-bottom: 1px solid #777;
}
.innerMenuWrap { margin: 0 auto; }
.menu { text-align: center; padding: 7px 0 0 0; }
.menu a { color: #fff; font-weight: bold; font-size: 12px; }
.menu .rf { color: #e8f2f8; float: right; font-size: 11px; font-weight: normal; padding-right: 6px; }

#nicemenu { display: inline-block; }
#nicemenu ul { list-style: none; margin: 0; padding: 0; }
#nicemenu li { display: inline-block; position: relative; margin: 0 8px; }
#nicemenu li:hover .sub_menu { display: block; }
#nicemenu .sub_menu {
  display: none; position: absolute; left: 0; top: 100%;
  background: #fff; border: 1px solid #999; min-width: 170px;
  z-index: 50; text-align: left; padding: 4px 0;
  box-shadow: 2px 2px 4px rgba(0,0,0,.25);
}
/* invisible bridge: keeps hover alive for diagonal mouse paths */
#nicemenu .sub_menu::before {
  content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px;
}
#nicemenu .sub_menu a {
  display: block; color: #333 !important; font-weight: normal !important;
  padding: 4px 12px; font-size: 12px;
}
#nicemenu .sub_menu a:hover { background: #eef4f8; color: var(--link) !important; }
#nicemenu .arrow { margin-left: 2px; }

/* ---------- body ---------- */
#bodyWrap {
  padding: 10px; width: 1024px;
  margin: 10px auto 0 auto;
  text-align: left; clear: both;
  background: #fff;
}

.colsTable { width: 100%; table-layout: fixed; }
.leftColumn { width: 180px; vertical-align: top; padding-right: 10px; }
.frontMainColumn { vertical-align: top; padding: 0 10px; }
.rightColumn { width: 180px; vertical-align: top; padding-left: 10px; }

.leftModule, .rightModule {
  background: #f2f6f9; border: 1px solid #d7e2ea;
  padding: 8px; margin-bottom: 10px;
  font-size: 12px; line-height: 1.7;
}
.leftModule .left, .rightModule .left {
  font-weight: bold; color: #444; font-size: 12px;
  border-bottom: 1px solid #d7e2ea; padding-bottom: 3px; margin-bottom: 5px;
}
.csep { padding: 2px 0; border-bottom: 1px dotted #e4e9ed; }

.sideThumb {
  float: left; width: 76px; margin: 2px 4px 6px 0;
  font-size: 11px; color: #333; line-height: 1.3; text-align: center;
}
.sideThumb img { width: 70px; height: 56px; border: 1px solid #ccc; background: #fff; display: block; margin: 0 auto 2px auto; }
.sideThumb:hover img { border-color: var(--link); }

.stamps { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.stamp2 img { width: 40px; height: 40px; border: 1px solid #ccc; background: #fff; }
.stamp2:hover img { border-color: var(--link); }

/* center column forum tables (2008 style) */
.forumFront tr { background: #fff; }
.forumFront td { border-bottom: 1px solid #e4e9ed; padding: 4px 6px; vertical-align: top; }
.forumFront td.misc1 { background: #dce9f4; }
.forumFront .center { text-align: center; }
.forumFront td.misc1 a { font-size: 11px; }

.moduleTitle { background: #5b96c0; color: #fff; font-weight: bold; padding: 4px 8px; margin: 12px 0 0 0; font-size: 13px; }
table.bmTable { width: 100%; border-collapse: collapse; margin-bottom: 10px; background: #fff; }
table.bmTable td { border-bottom: 1px solid #e4e9ed; padding: 4px 8px; vertical-align: top; }

.sep { border-left: 1px solid #e4e9ed; }
.small { font-size: 11px; color: #777; }
.normal { font-size: 13px; }
.right { text-align: right; font-size: 11px; margin-bottom: 2px; }
.left { text-align: left; }
.center { text-align: center; }
.mb10 { margin-bottom: 10px; }
.mt5 { margin-top: 5px; }
.np { padding: 0 !important; }
.cl { clear: left; }
.cb { clear: both; }
.cl, .cb { padding: 0; height: 0; font-size: 0; line-height: 0; }

.post { border: 1px solid #d7e2ea; margin-bottom: 8px; background: #fff; }
.postHead { background: #eef4f8; padding: 4px 8px; font-size: 12px; color: #555; border-bottom: 1px solid #d7e2ea; }
.postBody { padding: 8px; line-height: 1.5; }

.copyright { font-size: 11px; color: #999; padding: 14px 0; text-align: center; clear: both; }
pre { background: #f7f7f7; border: 1px solid #ddd; padding: 8px; font-size: 11px; overflow-x: auto; }
code { background: #f0f0f0; padding: 0 3px; }

/* breadcrumb + pager (subpages keep working) */
.breadcrumb { font-size: 11px; color: #666; margin-bottom: 6px; }
.pager { text-align: right; margin: 6px 0; }
.pgn { font-size: 11px; color: #777; margin-right: 6px; }
.btn, a.btn, a.btn:visited {
  background: #797979; color: #fff; font-family: tahoma, verdana, arial; text-transform: uppercase;
  width: auto; min-width: 64px; text-align: center; padding: 2px 8px; font-size: 9px;
  display: inline-block; margin-right: 2px; line-height: 1.4em; text-decoration: none; border: 0;
  cursor: pointer;
}
.btn:hover { background: #219ade; color: #fff; }

/* forum + screens pages (kept from classic rebuild) */
.bbTop { background: #219ade; color: #fff; font-weight: bold; padding: 5px 8px; font-size: 13px; margin-bottom: 2px; }
.forumTable td { padding: 6px 8px; border-bottom: 1px solid #e4e9ed; vertical-align: top; }
.forumTable tr.misc1 td { background: #dce9f4; font-size: 12px; padding: 3px 8px; }
.fic { float: left; margin-right: 8px; border: 0; }
.threadTable td { padding: 5px 8px; border-bottom: 1px solid #eee; font-size: 12px; }
.thumbGrid { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0; }
.thumbCell { width: 150px; text-align: center; }
.thumbCell img { max-width: 150px; max-height: 113px; border: 1px solid #d7e2ea; background: #fff; }
.thumbCell a { display: block; text-decoration: none; color: #333; }
.thumbCell .small { display: block; margin-top: 3px; font-size: 10px; line-height: 1.3; height: 26px; overflow: hidden; }
.screenView img { max-width: 100%; border: 1px solid #d7e2ea; }

/* ---------- modern niceties (not in 2008, subtle) ---------- */
@media (max-width: 1064px) {
  .innerWrap, .menuWrap, #bodyWrap { width: auto; margin-left: 8px; margin-right: 8px; }
  table.cols, #bodyWrap > table { width: 100%; }
  .leftColumn, .rightColumn { display: block; width: auto; }
  .frontMainColumn { display: block; width: auto; padding: 0; }
}
@media (prefers-reduced-motion: no-preference) {
  a, img { transition: none; }
}

/* seen-tracker (js/seen.js): dims already-viewed screens/threads */
.bmSeen { opacity: 0.45; }
.bmSeen img { filter: grayscale(60%); }
.bmSeenBadge { position: fixed; right: 12px; bottom: 12px; z-index: 50;
  background: #2e4a5a; color: #fff; font-size: 11px; padding: 4px 8px;
  border-radius: 10px; opacity: 0.75; cursor: pointer; }
.bmSeenBadge:hover { opacity: 1; }
.postLayout { border-collapse: collapse; }
.postLayout td { vertical-align: top; }
.avCell { padding: 0 10px 0 0; width: 48px; }
img.avatar { display: block; border: 1px solid #d7e2ea; background: #fff; image-rendering: pixelated; }

/* numbered pager: current page */
.btn.cur, span.btn.cur { background: #219ade; color: #fff; }