/* ============================================================
   JMBarker.com — Modern Dark Override for Legacy Pages v2
   Matches homepage: dark bg, muted gold accents, cream text
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Barlow+Condensed:wght@400;600;700&family=Source+Sans+3:wght@300;400;600&display=swap');

:root {
  --bg:      #0a0805;
  --gold:    #b89a56;    /* softened — less saturated, lighter */
  --rust:    #a06040;    /* toned down — muted terracotta, not loud orange */
  --cream:   #ddd8cc;
  --sand:    #a89878;
  --white:   #edeae2;
  --fd:      'Barlow Condensed', sans-serif;
  --fs:      'Playfair Display', serif;
  --fb:      'Source Sans 3', sans-serif;
}

/* ---- Kill parchment tile backgrounds by class name ---- */
.c476, .c481, .c484, .c489, .c492, .c497,
.c500, .c505, .c508, .c512, .c951, .c952,
.c955, .c1354, .c1355, .c1726, .c1900, .c1901, .c1902 {
  background-image: none !important;
  background-color: transparent !important;
}

/* ---- Kill ALL background images site-wide on legacy pages ---- */
body#b *,
body#b {
  background-image: none !important;
}

/* ---- Page base ---- */
html { background-color: var(--bg) !important; }

body#b {
  background-color: var(--bg) !important;
  color: var(--cream) !important;
  font-family: var(--fb) !important;
}

/* ---- Force all containers dark ---- */
body#b div,
body#b section,
body#b article,
body#b main,
body#b header,
body#b footer,
body#b table,
body#b td,
body#b th {
  background-color: transparent !important;
  background-image: none !important;
}

/* ---- Hide old brown nav ---- */
#menu { display: none !important; }

/* ---- Modern top nav bar (inserted via JS injection) ---- */
body#b::before {
  content: '';
  display: block;
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 60px;
  background-color: rgba(10,8,5,0.96) !important;
  border-bottom: 1px solid rgba(184,154,86,0.2);
  z-index: 9998;
  backdrop-filter: blur(8px);
}

#jmb-topnav {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 60px;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 0 2rem;
  z-index: 9999;
  pointer-events: auto;
}

#jmb-topnav .jmb-logo {
  font-family: var(--fd);
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  color: var(--gold) !important;
  text-decoration: none !important;
  font-weight: 700;
}

#jmb-topnav .jmb-logo span {
  color: var(--white) !important;
  font-weight: 400;
}

#jmb-topnav .jmb-home-btn {
  font-family: var(--fb);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold) !important;
  text-decoration: none !important;
  border: 1px solid rgba(184,154,86,0.5);
  padding: 0.45rem 1.1rem;
  transition: background 0.2s, color 0.2s;
}

#jmb-topnav .jmb-home-btn:hover {
  background-color: var(--gold) !important;
  color: var(--bg) !important;
}

/* ---- Push content below fixed nav ---- */
body#b > div:first-of-type {
  padding-top: 70px !important;
}

/* ---- Headings ---- */
body#b h1,
body#b h2,
body#b h3,
body#b h4,
body#b h5,
body#b h6 {
  color: var(--white) !important;
  font-family: var(--fd) !important;
}

/* Main page title gets the muted gold */
body#b h2:not(#jmb-topnav h2) {
  color: var(--gold) !important;
}

/* ---- Body text ---- */
body#b p,
body#b span,
body#b li,
body#b td,
body#b th,
body#b caption {
  color: var(--cream) !important;
  font-family: var(--fb) !important;
}

/* ---- Links ---- */
body#b a:not(#jmb-topnav a) {
  color: var(--sand) !important;
  text-decoration: none !important;
}

body#b a:not(#jmb-topnav a):hover {
  color: var(--gold) !important;
}

/* ---- Photo captions ---- */
body#b .f269, body#b .f270, body#b .f271,
body#b .f272, body#b .f273, body#b .f274,
body#b .f336, body#b .f337, body#b .f338 {
  color: var(--sand) !important;
  font-style: italic !important;
}

/* ---- Images ---- */
body#b img {
  border: 1px solid rgba(184,154,86,0.12) !important;
  border-radius: 2px;
  transition: transform 0.2s ease, border-color 0.2s ease;
}

body#b img:hover {
  border-color: rgba(184,154,86,0.4) !important;
  transform: scale(1.015);
}

/* ---- Hide decorative legacy Sparkle stamps & stickers ---- */
body#b img[src*="stamp"],
body#b img[src*="sticker"],
body#b img[src*="arrived"],
body#b img[src*="shapeimage_3"],
body#b img[src*="shapeimage_2"],
body#b img[src*="shapeimage_1"] {
  display: none !important;
}

/* ---- Slideshow links ---- */
body#b a[href*="slideshow"] {
  display: inline-block !important;
  background-color: rgba(184,154,86,0.15) !important;
  color: var(--gold) !important;
  font-family: var(--fb) !important;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.55rem 1.3rem !important;
  border: 1px solid rgba(184,154,86,0.35) !important;
  border-radius: 2px;
  margin: 0.4rem 0;
  transition: background 0.2s;
}

body#b a[href*="slideshow"]:hover {
  background-color: rgba(184,154,86,0.3) !important;
  color: var(--white) !important;
}

/* ---- Hide autoplay audio ---- */
body#b audio { display: none !important; }

/* ---- Scrollbar ---- */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: rgba(184,154,86,0.35); border-radius: 3px; }


/* ============================================================
   Hide ALL legacy decorative / clipart images
   ============================================================ */

/* Coins (African coins clipart) */
body#b img[src*="african"],
body#b img[src*="coins"] { display: none !important; }

/* Stevie Ray Vaughan portrait */
body#b img[src*="stevie"],
body#b img[src*="vaughan"],
body#b img[src*="3fq3dstevie"] { display: none !important; }

/* Dotted path arc widget */
body#b img[src*="dotted_path"] { display: none !important; }

/* Doodle clouds */
body#b img[src*="doodle_photos"],
body#b img[src*="doodle_cloud"] { display: none !important; }

/* All shapeimage decoratives (icons, badges, decorative shapes) */
body#b img[src*="shapeimage"] { display: none !important; }

/* Stamp / arrived postage */
body#b img[src*="2_stamp"],
body#b img[src*="stamp_arrived"],
body#b img[src*="arrived"] { display: none !important; }

/* Long URL-encoded Google image filenames (all legacy clipart) */
body#b img[src*="3fq3d"] { display: none !important; }

