/* =========================================================
   Luminary Skin (Full Replace)
   Drop-in theme layer that overrides layout.css styling
   ========================================================= */

/* ---------- Theme tokens ---------- */
.theme-luminary{
  --bg: #0b0f14;
  --panel: #111826;
  --panel2: #0f172a;
  --text: #e5e7eb;
  --muted: #9ca3af;

  --accent: #8b5cf6;      /* violet */
  --accent2:#22c55e;      /* green */
  --line: rgba(255,255,255,.10);

  --radius: 14px;
  --shadow: 0 12px 30px rgba(0,0,0,.35);
}

/* global */
.theme-luminary body{
  background: radial-gradient(1200px 700px at 30% 0%, rgba(139,92,246,.18), transparent 60%),
              radial-gradient(900px 600px at 90% 10%, rgba(34,197,94,.14), transparent 55%),
              var(--bg);
  color: var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  font-size: 13px;
}

.theme-luminary a:link,
.theme-luminary a:visited{
  color: var(--text);
}

.theme-luminary a:hover,
.theme-luminary a:focus{
  color: #fff;
  text-decoration: none;
}

/* header banner: ditch the serebii-style image */
.theme-luminary #header .banner{
  background: linear-gradient(90deg, rgba(139,92,246,.55), rgba(34,197,94,.35));
  border-bottom: 1px solid var(--line);
}
.theme-luminary #header .banner img{
  opacity: 0; /* keep markup but hide the old look */
  height: 86px;
}

/* =========================================================
   Quick Links - readability upgrade
   ========================================================= */
.theme-luminary #header nav.quicklinks{
  background: rgba(17,24,38,.92);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.12);
  border-left: 0;
  border-right: 0;
  padding: 8px 10px;
}

/* remove the hyphen separators from layout.css */
.theme-luminary #header nav.quicklinks li:after{
  content: "" !important;
}

/* give pills breathing room */
.theme-luminary #header nav.quicklinks li{
  margin: 6px 8px 6px 0;
}

/* "Quick Links" label */
.theme-luminary #header nav.quicklinks li b{
  color: #e5e7eb;
  font-weight: 700;
  letter-spacing: .2px;
  opacity: .95;
}

/* pill links */
.theme-luminary #header nav.quicklinks a{
  display:inline-block;
  padding: 7px 12px;
  border-radius: 999px;

  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);

  font-size: 12px;
  font-weight: 600;
  letter-spacing: .15px;
  color: #e5e7eb;
  line-height: 1;
}

/* hover/focus clarity */
.theme-luminary #header nav.quicklinks a:hover,
.theme-luminary #header nav.quicklinks a:focus{
  background: linear-gradient(90deg, rgba(139,92,246,.34), rgba(34,197,94,.22));
  border-color: rgba(139,92,246,.65);
  color: #ffffff;
  outline: none;
}

/* subtle pressed state */
.theme-luminary #header nav.quicklinks a:active{
  transform: translateY(1px);
}

/* desktop bump for readability */
@media (min-width: 1012px){
  .theme-luminary #header nav.quicklinks a{
    font-size: 13px;
    padding: 8px 14px;
  }
}

/* =========================================================
   Wrapper and panels
   ========================================================= */
.theme-luminary #wrapper{
  gap: 12px;
  padding: 12px;
}

/* left & right bars become panels */
.theme-luminary #lbar,
.theme-luminary #rbar{
  background: rgba(17,24,38,.70);
  backdrop-filter: blur(10px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}

/* nav headers become modern section headers */
.theme-luminary #lbar .navheader,
.theme-luminary #lbar a.navheader,
.theme-luminary #rbar .navheader,
.theme-luminary #rbar a.navheader{
  background: linear-gradient(90deg, rgba(139,92,246,.35), rgba(34,197,94,.18));
  color: var(--text);
  text-shadow: none;
  border: 0;
  padding: 10px 10px;
  letter-spacing: .3px;
}

.theme-luminary #lbar a.navheader:hover,
.theme-luminary #rbar a.navheader:hover{
  background: linear-gradient(90deg, rgba(139,92,246,.45), rgba(34,197,94,.24));
}

/* links inside bars */
.theme-luminary #lbar a,
.theme-luminary #rbar a,
.theme-luminary #lbar strong{
  color: var(--text) !important;
}

.theme-luminary #lbar ul li ul a{
  padding: 8px 10px;
  border-top: 1px solid rgba(255,255,255,.06);
  color: var(--muted) !important;
}

.theme-luminary #lbar ul li ul a:hover{
  color: var(--text) !important;
  background: rgba(255,255,255,.04);
}

/* main content becomes a panel too */
.theme-luminary #content{
  background: rgba(15,23,42,.55);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 14px;
}

/* reusable card look */
.theme-luminary .card{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius);
  padding: 14px;
}

.theme-luminary .hero h1{
  margin: 0 0 6px 0;
  font-size: 22px;
}

.theme-luminary .hero p{
  color: var(--muted);
  margin: 0;
}

/* right bar quote widget */
.theme-luminary #rbar .quoteBox{
  margin: 10px;
  padding: 12px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(139,92,246,.16), rgba(34,197,94,.08));
  border: 1px solid rgba(255,255,255,.10);
}

.theme-luminary #rbar .quoteBox strong{
  display:block;
  font-size: 13px;
  line-height: 1.5;
}

.theme-luminary #rbar .quoteBox .author{
  display:block;
  margin-top: 8px;
  color: var(--muted);
  font-style: italic;
}

/* footer modern */
.theme-luminary footer#footer .copyright{
  background: rgba(17,24,38,.75);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--muted);
}

/* footer links */
.theme-luminary #footer a:link,
.theme-luminary #footer a:visited{
  color: #cbd5e1;
}
.theme-luminary #footer a:hover{
  color: #ffffff;
}
/* =========================================================
   Blog / Archive post styling (modern cards)
   ========================================================= */

/* main reading column: easier to scan */
.theme-luminary #content main{
  max-width: 1280px;
  margin: 0 auto;
}

/* each "post" becomes a card */
.theme-luminary .post{
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
  padding: 18px 18px 16px;
  margin: 16px 0 18px;
  position: relative;
  overflow: hidden;
}

/* subtle top accent line per post */
.theme-luminary .post::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height: 2px;
  background: linear-gradient(90deg, rgba(34,197,94,.85), rgba(139,92,246,.75));
  opacity: .9;
}

/* post titles */
.theme-luminary .post > h2{
  margin: 6px 0 10px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.2;
}

/* metadata row */
.theme-luminary .post .info{
  margin: 0 0 14px;
  padding: 8px 10px;
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;

  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
  border-radius: 12px;

  color: rgba(229,231,235,.85);
  font-size: 12px;
}

.theme-luminary .post .info .date{
  font-weight: 700;
  color: rgba(229,231,235,.95);
}

.theme-luminary .post .info .user a{
  color: rgba(229,231,235,.95) !important;
  text-decoration: none;
  border-bottom: 1px dotted rgba(255,255,255,.25);
}
.theme-luminary .post .info .user a:hover{
  border-bottom-color: rgba(139,92,246,.7);
}

/* keep paragraphs readable */
.theme-luminary .post p{
  line-height: 1.65;
  color: rgba(229,231,235,.88);
  margin: 8px 0 0;
  max-width: 92ch;
}

/* =========================================================
   Sections inside a post (.subcat)
   ========================================================= */

.theme-luminary .post .subcat{
  margin: 12px 0;
  padding: 14px 14px 12px;

  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;

  position: relative;
}

/* left accent bar to separate sections */
.theme-luminary .post .subcat::before{
  content:"";
  position:absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(139,92,246,.9), rgba(34,197,94,.75));
  opacity: .7;
}

/* section headings */
.theme-luminary .post .subcat h3{
  margin: 0 0 6px;
  padding-left: 10px;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .7px;
  color: rgba(229,231,235,.95);
}

/* sometimes you have h2 inside subcat (like Saturday: PARTY BINGO!) */
.theme-luminary .post .subcat h2{
  margin: 4px 0 8px;
  padding-left: 10px;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

/* little "title" line under h3 */
.theme-luminary .post .subcat p.title{
  margin: 0 0 8px;
  padding-left: 10px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(156,163,175,.95);
}

/* add padding-left to account for accent bar */
.theme-luminary .post .subcat > *{
  padding-left: 10px;
}

/* =========================================================
   Media: pics, iframes, videos
   ========================================================= */

.theme-luminary .post .pics{
  margin: 12px 0 6px;
  display: flex;
  justify-content: center;
}

.theme-luminary .post .pics img,
.theme-luminary .post .pics video,
.theme-luminary .post .pics iframe{
  max-width: min(720px, 100%);
  width: auto;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 16px 35px rgba(0,0,0,.35);
}

/* make your inline width="300" not feel tiny on desktop */
.theme-luminary .post .pics img[width="300"],
.theme-luminary .post .pics video[width="300"]{
  width: min(560px, 100%) !important;
  height: auto !important;
}

/* =========================================================
   Slideshow controls (prev/next) – optional polish
   ========================================================= */
.theme-luminary .slideshow-container{
  margin-top: 10px;
  position: relative;
  border-radius: 14px;
  padding: 8px 0;
}

.theme-luminary .slideshow-container .prev,
.theme-luminary .slideshow-container .next{
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  padding: 10px 12px;
  border-radius: 999px;

  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  user-select: none;
}

.theme-luminary .slideshow-container .prev{ left: 10px; }
.theme-luminary .slideshow-container .next{ right: 10px; }

.theme-luminary .slideshow-container .prev:hover,
.theme-luminary .slideshow-container .next:hover{
  background: rgba(139,92,246,.28);
  border-color: rgba(139,92,246,.55);
}