/* ==========================================================================
   PlayLithium — dark mode
   Loaded last so it wins over the Mesmerize theme. Scoped overrides only;
   remove this one <link> to revert the site to light.
   ========================================================================== */

:root {
  --plp-bg:        #0e1013;
  --plp-surface:   #161a20;
  --plp-surface-2: #1c2129;
  --plp-border:    #272d38;
  --plp-text:      #c9d1d9;
  --plp-heading:   #e9edf2;
  --plp-muted:     #8b949e;
  --plp-accent:    #38bdf8;
}

/* --- page ---------------------------------------------------------------- */
html { background-color: var(--plp-bg) !important; }
body {
  background-color: var(--plp-bg) !important;
  color: var(--plp-text) !important;
}
#page, #page-top, .content, #page-content, .gridContainer {
  background-color: transparent !important;
  color: var(--plp-text) !important;
}

/* --- typography ---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.hero-title, .post-title, .post-title a, .widgettitle {
  color: var(--plp-heading) !important;
}
p, li, span, div, td, blockquote, .post-excerpt, .post-content, .post-content-inner {
  color: var(--plp-text);
}
.hero-title { color: #fff !important; }
small, .muted, .text-muted { color: var(--plp-muted) !important; }

a { color: var(--plp-accent) !important; }
a:hover, a:focus { color: #7dd3fc !important; }
.read-more { color: var(--plp-accent) !important; }

/* --- hero / header ------------------------------------------------------- */
.header-wrapper, .inner-header-description, .header-description-row {
  background-color: transparent !important;
}
.header-homepage {
  /* keep the hero photo, just take the edge off the purple and darken it */
  background-blend-mode: multiply;
  background-color: #2b2f5e !important;
  filter: saturate(.85) brightness(.72);
}
.header-top-bar, .navigation-bar, .navigation-wrapper, #mainmenu_container {
  background-color: var(--plp-surface) !important;
  border-color: var(--plp-border) !important;
}
#main_menu > li > a, .main-menu a, .navigation-bar a, .top-bar-field, .top-bar-field a {
  color: var(--plp-text) !important;
}
#main_menu > li > a:hover, .main-menu a:hover { color: var(--plp-accent) !important; }
.offcanvas-right, #offcanvas-menu, .offcanvas_menu {
  background-color: var(--plp-surface) !important;
}
#offcanvas_menu a, .offcanvas_menu a { color: var(--plp-text) !important; }

/* --- cards / posts ------------------------------------------------------- */
.card, .blog-post, .post-content, .post-content-single,
.post-list-item, .post-item, article {
  background-color: var(--plp-surface) !important;
  border-color: var(--plp-border) !important;
  color: var(--plp-text) !important;
}
.post-list-item .post-content { background-color: var(--plp-surface) !important; }
.post-thumbnail img { border-radius: 6px 6px 0 0; }

/* --- sidebar widgets ----------------------------------------------------- */
.sidebar, .sidebar-row, .widget {
  background-color: transparent !important;
  color: var(--plp-text) !important;
}
.widgettitle { border-color: var(--plp-border) !important; }
.widget ul li a, .widget a { color: var(--plp-text) !important; }
.widget ul li a:hover, .widget a:hover { color: var(--plp-accent) !important; }
.widget ul li { border-color: var(--plp-border) !important; }
.tagcloud a {
  background-color: var(--plp-surface-2) !important;
  color: var(--plp-text) !important;
  border: 1px solid var(--plp-border) !important;
}

/* --- footer / contact strip ---------------------------------------------- */
footer, .footer, .footer-wrapper, .footer-content,
.content + div, .footer-bg-accent {
  background-color: var(--plp-surface) !important;
  color: var(--plp-text) !important;
  border-color: var(--plp-border) !important;
}
.footer p, .footer a, .copyright, .copyright a, .footer-social-icons a {
  color: var(--plp-muted) !important;
}
.footer-bg-accent { background-color: var(--plp-surface-2) !important; }
i.big-icon, .big-icon { color: var(--plp-accent) !important; }
.mesmerize-theme-link, .mesmerize-theme-link:hover { color: var(--plp-muted) !important; }

/* --- forms / misc -------------------------------------------------------- */
input, textarea, select {
  background-color: var(--plp-surface-2) !important;
  color: var(--plp-text) !important;
  border: 1px solid var(--plp-border) !important;
}
blockquote {
  background-color: var(--plp-surface-2) !important;
  border-left-color: var(--plp-accent) !important;
}
hr { border-color: var(--plp-border) !important; }
code, pre {
  background-color: var(--plp-surface-2) !important;
  color: #a5d6ff !important;
}

/* --- blog figures (new posts) -------------------------------------------- */
.plp-figure img { box-shadow: 0 6px 24px rgba(0,0,0,.55); }
.plp-figure figcaption { color: var(--plp-muted); }

/* --- scrollbar (webkit) -------------------------------------------------- */
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: var(--plp-bg); }
::-webkit-scrollbar-thumb { background: #313743; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #3d4553; }