/*
Theme Name: Mad Zeeks Storyhouse Child
Theme URI: https://example.com/mad-zeeks-storyhouse-child
Description: Child theme of Mad Zeeks Storyhouse for seasonal and holiday customizations.
Author: Mad Zeeks
Author URI: https://example.com
Template: mad-zeeks-storyhouse
Version: 1.2.1
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mad-zeeks-storyhouse-child
*/

/* -------------------------------------------------------------------------
   Business-card palette (Mad Zeeks Books card art)
   Green = MAD ZEEKS title / slime → headers & links
   Red   = hat / book              → primary buttons
   Cream = BOOKS type              → body text
   ------------------------------------------------------------------------- */

:root {
  /* Title / slime greens from the card */
  --mz-green: #6d8108;
  --mz-green-bright: #8aa615;
  --mz-green-hot: #b4d12a;
  --mz-zombie: var(--mz-green-bright);
  --mz-green-deep: #556d0d;

  /* Hat / book crimson from the card */
  --mz-red: #c5190b;
  --mz-red-hot: #d33216;
  --mz-red-deep: #9f0a04;

  /* BOOKS cream */
  --mz-cream: #ede4c3;

  /* Remap parent tokens */
  --mz-teal: #152018;
  --mz-teal-dark: #0c120e;
  --mz-orange: var(--mz-green-bright); /* headings / accents follow title green */
  --mz-black: #050505;
  --mz-bg: #0a0a09;
  --mz-surface: #141612;
  --mz-surface-raised: #1c1f18;
  --mz-ink: var(--mz-cream);
  --mz-muted: #a3b07c;
  --mz-primary: var(--mz-red);
  --mz-accent: var(--mz-green-bright);
  --mz-border: rgba(109, 129, 8, 0.4);
  --mz-shadow: 0 8px 24px rgba(0, 0, 0, 0.55);
}

/* Gray brick wall extracted from the business card */
body {
  background-color: var(--mz-bg);
  background-image: url("assets/images/bg-brick.png");
  background-repeat: repeat;
  background-position: center top;
  background-size: 288px 288px;
}

.site-main {
  background: transparent;
}

/* ===== Links ===== */

a {
  color: var(--mz-green-bright);
}

a:hover,
a:focus-visible {
  color: var(--mz-green-hot);
}

.inline-menu a,
.site-footer a,
.entry-content a {
  color: var(--mz-green-bright);
}

.inline-menu a:hover,
.inline-menu a:focus-visible,
.inline-menu .current-menu-item > a,
.site-footer a:hover,
.site-footer a:focus-visible,
.entry-content a:hover,
.entry-content a:focus-visible {
  color: var(--mz-green-hot);
}

/* ===== Site header / nav ===== */

.site-header {
  background: rgba(12, 18, 14, 0.94);
  border-bottom: 1px solid rgba(109, 129, 8, 0.35);
  backdrop-filter: blur(6px);
}

.site-header__announcement {
  background: var(--mz-teal-dark);
  color: var(--mz-cream);
  border-bottom-color: rgba(197, 25, 11, 0.4);
}

.site-header__announcement a {
  color: var(--mz-green-bright);
}

.site-header__announcement a:hover,
.site-header__announcement a:focus-visible {
  color: var(--mz-green-hot);
}

.site-title,
.site-title a {
  color: var(--mz-green-bright);
}

.site-title a:hover,
.site-title a:focus-visible {
  color: var(--mz-green-hot);
}

.site-tagline {
  color: var(--mz-muted);
}

.primary-menu a {
  color: var(--mz-cream);
}

.primary-menu a:hover,
.primary-menu .current-menu-item > a {
  color: var(--mz-green-hot);
  background: rgba(109, 129, 8, 0.22);
}

.primary-menu .sub-menu {
  background: #0c120e;
  border-color: rgba(109, 129, 8, 0.45);
}

.primary-menu .sub-menu a {
  color: var(--mz-cream);
}

.primary-menu .sub-menu a:hover,
.primary-menu .sub-menu .current-menu-item > a {
  color: var(--mz-green-hot);
  background: rgba(109, 129, 8, 0.2);
}

.site-header__end .social-icons__link,
.social-icons--header .social-icons__link {
  color: var(--mz-cream);
  border-color: rgba(109, 129, 8, 0.4);
}

.social-icons__link:hover,
.social-icons__link:focus-visible {
  color: var(--mz-green-hot);
  border-color: var(--mz-green-bright);
  background: rgba(109, 129, 8, 0.25);
}

.site-branding__badge {
  background: var(--mz-green-bright);
}

.back-to-top {
  background: #0c120e;
  color: var(--mz-green-bright);
  border-color: rgba(109, 129, 8, 0.5);
}

.back-to-top:hover,
.back-to-top:focus-visible {
  background: var(--mz-green);
  border-color: var(--mz-green-bright);
  color: #0a0a09;
}

/* ===== Headings ===== */

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.card__title,
.content-grid__headline,
.story-list__headline,
.hero__eyebrow {
  color: var(--mz-green-bright);
}

.hero--featured-book h1,
.hero--featured-book h2 {
  color: #ffffff;
}

.hero--featured-book .hero__eyebrow {
  color: var(--mz-green-hot);
}

.story {
  border-left-color: var(--mz-green-bright);
}

/* ===== Buttons ===== */

.button--primary,
.card--home-news .card__cta .button--primary,
.book-card__actions .button--primary,
.featured-series__content .button--primary {
  background: var(--mz-red);
  border-color: var(--mz-red);
  color: #fff8f0;
}

.button--primary:hover,
.button--primary:focus-visible,
.card--home-news .card__cta .button--primary:hover,
.card--home-news .card__cta .button--primary:focus-visible,
.book-card__actions .button--primary:hover,
.book-card__actions .button--primary:focus-visible {
  background: var(--mz-red-hot);
  border-color: var(--mz-red-hot);
  color: #ffffff;
}

.button--secondary {
  background: transparent;
  border: 2px solid var(--mz-green-bright);
  color: var(--mz-green-bright);
}

.button--secondary:hover,
.button--secondary:focus-visible {
  background: rgba(138, 166, 21, 0.2);
  border-color: var(--mz-green-hot);
  color: var(--mz-green-hot);
}

/* Hero “Read More”: keep readable on photos, still card-green */
.hero--featured-book .button--secondary {
  background: rgba(10, 10, 9, 0.55);
  border-color: var(--mz-green-bright);
  color: var(--mz-green-hot);
}

.hero--featured-book .button--secondary:hover,
.hero--featured-book .button--secondary:focus-visible {
  background: rgba(109, 129, 8, 0.45);
  border-color: var(--mz-green-hot);
  color: #ffffff;
}

.hero--featured-book .button--primary {
  background: var(--mz-red);
  border-color: var(--mz-red);
  color: #fff8f0;
}

.hero--featured-book .button--primary:hover,
.hero--featured-book .button--primary:focus-visible {
  background: var(--mz-red-hot);
  border-color: var(--mz-red-hot);
  color: #ffffff;
}

/* Catalog / series secondary buttons (parent uses !important) */
.series-book--catalog .button--secondary {
  color: var(--mz-green-bright) !important;
  border-color: var(--mz-green-bright) !important;
}

.series-book--catalog .button--secondary:hover,
.series-book--catalog .button--secondary:focus-visible {
  color: var(--mz-green-hot) !important;
  border-color: var(--mz-green-hot) !important;
  background: rgba(138, 166, 21, 0.18) !important;
}

/* ===== Breadcrumbs ===== */

.site-breadcrumbs {
  background: rgba(10, 10, 9, 0.72);
  border-bottom-color: var(--mz-border);
}

.site-breadcrumbs__list {
  color: var(--mz-muted);
}

.site-breadcrumbs__item:not(:last-child)::after {
  color: var(--mz-green-deep);
}

.site-breadcrumbs__link {
  color: #c5d39a;
}

.site-breadcrumbs__link:hover,
.site-breadcrumbs__link:focus-visible,
.site-breadcrumbs__link.is-current,
.site-breadcrumbs__link[aria-current="page"] {
  color: var(--mz-green-hot);
}

/* ===== Surfaces / footer ===== */

.card {
  background: rgba(20, 22, 18, 0.88);
  border-color: var(--mz-border);
}

.site-footer {
  background: rgba(8, 10, 8, 0.94);
  border-top: 1px solid rgba(109, 129, 8, 0.3);
  color: var(--mz-muted);
}

.site-footer__copyright {
  color: var(--mz-muted);
}

.site-footer .social-icons__link {
  color: var(--mz-muted);
  background: rgba(109, 129, 8, 0.15);
  border-color: rgba(109, 129, 8, 0.35);
}

.site-footer .social-icons__link:hover,
.site-footer .social-icons__link:focus-visible {
  color: #ffffff;
  border-color: var(--mz-green-bright);
}

/* ===== Green goo splats (card art) — decorative, never intercepts clicks ===== */

.site-shell {
  position: relative;
  isolation: isolate;
}

.mz-goo-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.site-header,
.site-breadcrumbs,
.site-main,
.site-footer {
  position: relative;
  z-index: 1;
}

.site-header {
  z-index: 30;
}

.mz-goo {
  position: absolute;
  top: var(--mz-goo-top, 10%);
  width: var(--mz-goo-size, 200px);
  height: var(--mz-goo-size, 200px);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: var(--mz-goo-opacity, 0.88);
  transform: rotate(var(--mz-goo-rot, 0deg)) scaleX(var(--mz-goo-flip, 1));
  filter: saturate(1.55) brightness(1.45) contrast(1.2);
  mix-blend-mode: normal;
}

/*
 * Keep goo in the side gutters outside the content column so it does not
 * sit on top of headings, cards, or paragraphs.
 */
.mz-goo--left {
  left: max(-2.5rem, calc(50% - (var(--mz-max-width) / 2) - var(--mz-goo-size) - 0.75rem + var(--mz-goo-nudge, 0px)));
  right: auto;
}

.mz-goo--right {
  right: max(-2.5rem, calc(50% - (var(--mz-max-width) / 2) - var(--mz-goo-size) - 0.75rem + var(--mz-goo-nudge, 0px)));
  left: auto;
}

@media (max-width: 1200px) {
  .mz-goo {
    opacity: calc(var(--mz-goo-opacity, 0.88) * 0.9);
    width: calc(var(--mz-goo-size, 200px) * 0.85);
    height: calc(var(--mz-goo-size, 200px) * 0.85);
  }

  .mz-goo--left {
    left: -1.25rem;
  }

  .mz-goo--right {
    right: -1.25rem;
  }
}

@media (max-width: 700px) {
  .mz-goo {
    opacity: calc(var(--mz-goo-opacity, 0.88) * 0.75);
    width: calc(var(--mz-goo-size, 200px) * 0.7);
    height: calc(var(--mz-goo-size, 200px) * 0.7);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mz-goo {
    transition: none;
  }
}

/* -------------------------------------------------------------------------
   Holiday / seasonal overrides (optional)
   ------------------------------------------------------------------------- */