/*
Theme Name: The Sunday Nest
Theme URI: https://thesundaynest.com
Description: Child theme of Kadence implementing The Sunday Nest brand kit (Olive & Honey palette, Playfair Display + Inter). Generated from config/brand.json — keep in sync.
Author: The Sunday Nest
Template: kadence
Version: 1.0.8
Text Domain: sunday-nest
*/

/* ---------- Brand tokens (mirror of config/brand.json — Olive & Honey) ---------- */
:root {
  --tsn-cream: #FBF7EC;
  --tsn-linen: #F4ECD9;
  --tsn-honey: #D9A441;
  --tsn-honey-deep: #7A5E14;
  --tsn-olive: #8A8F5C;
  --tsn-olive-deep: #54582E;
  --tsn-charcoal: #2E2A26;
  --tsn-white: #FFFFFF;

  /* Map onto Kadence's global palette so customizer-driven elements follow the brand */
  --global-palette1: #7A5E14; /* primary accent: buttons, links */
  --global-palette2: #54582E; /* secondary accent / hover */
  --global-palette3: #2E2A26; /* strongest text */
  --global-palette4: #45403A; /* headings */
  --global-palette5: #57504A; /* body text */
  --global-palette6: #867B6E; /* subtle text */
  --global-palette7: #F4ECD9; /* alt background (linen) */
  --global-palette8: #FBF7EC; /* background (cream) */
  --global-palette9: #FFFFFF; /* content white */
}

/* ---------- Typography ---------- */
body {
  font-family: 'Inter', system-ui, sans-serif;
  background-color: var(--tsn-cream);
  color: var(--tsn-charcoal);
}
h1, h2, h3, h4, h5, h6,
.site-branding .site-title,
.entry-title, .archive-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 500;
  color: var(--tsn-charcoal);
}
.single-content { font-size: 17px; line-height: 1.7; }

/* Readable measure for post content (spec: 65–75ch) */
.content-container.site-container { max-width: 1120px; }
.single .entry-content-wrap .entry-content > * { max-width: 74ch; margin-left: auto; margin-right: auto; }
.single .entry-content-wrap .entry-content > .alignwide,
.single .entry-content-wrap .entry-content > .alignfull,
.single .entry-content-wrap .entry-content > .wp-block-image { max-width: none; }

/* ---------- Links & buttons ---------- */
a { color: var(--tsn-honey-deep); }
a:hover { color: var(--tsn-olive-deep); }
.button, button, input[type="submit"], .wp-block-button__link {
  background: var(--tsn-honey-deep);
  color: var(--tsn-white);
  border-radius: 8px;
  font-weight: 600;
}
.button:hover, button:hover, input[type="submit"]:hover, .wp-block-button__link:hover {
  background: var(--tsn-olive-deep);
  color: var(--tsn-white);
}

/* ---------- Header / footer ---------- */
.site-header, .site-main-header-wrap { background: var(--tsn-cream); }
/* Compact header */
#masthead .site-header-row, .site-main-header-inner-wrap { min-height: 54px !important; }
.site-branding .site-title { font-size: 22px; font-weight: 600; }
.site-branding { padding: 4px 0; }

/* ---------- Homepage ---------- */
/* Kadence wraps page content in a white "content card" — on the cream body it reads
   as a random white box. Homepage sections carry their own backgrounds, so flatten it. */
body.home .content-bg, body.home article.entry { background: transparent; box-shadow: none; border: none; }
/* Kill the redundant "Home" page title + top gap so the hero starts right under the header */
body.home .entry-header { display: none; }
body.home .content-area { padding-top: 0 !important; margin-top: 0 !important; }
body.home .entry-content > .alignfull:first-child { margin-top: 0 !important; }

/* Category buttons as tile grid (closer to the mockup) */
body.home .wp-block-buttons { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
body.home .wp-block-buttons .wp-block-button { width: 100%; }
body.home .wp-block-buttons .wp-block-button__link {
  display: block; width: 100%; text-align: center;
  background: var(--tsn-white); color: var(--tsn-olive-deep);
  border: 1.5px solid var(--tsn-olive); border-radius: 10px;
  padding: 18px 10px; font-weight: 600; font-size: 15px;
}
body.home .wp-block-buttons .wp-block-button__link:hover { background: var(--tsn-olive-deep); color: var(--tsn-white); border-color: var(--tsn-olive-deep); }
/* …but keep the magnet + about-teaser buttons as solid CTAs, not tiles */
body.home .tsn-magnet .wp-block-buttons, body.home .alignfull .wp-block-buttons.is-layout-flex { display: flex; }
/* The tile rule above forces width:100% on every home button; inside flex CTA groups that
   makes the wrapper span full width and the link hug its left edge — undo it so
   justify-content centering actually centers (e.g. the "Our story" button). */
body.home .tsn-magnet .wp-block-buttons .wp-block-button,
body.home .alignfull .wp-block-buttons.is-layout-flex .wp-block-button { width: auto; }
body.home .alignfull .wp-block-button__link {
  background: var(--tsn-honey-deep); color: var(--tsn-white); border: none;
  display: inline-block; width: auto; padding: 12px 22px; font-size: 14px;
}
body.home .alignfull .wp-block-button__link:hover { background: var(--tsn-olive-deep); color: var(--tsn-white); }
.site-footer { background: var(--tsn-charcoal); color: #CFC7BC; }
.site-footer a { color: #E8DFD2; }
/* Light brand badge sits in a charcoal band flush with the footer */
.tsn-footer-logo { background: var(--tsn-charcoal); text-align: center; padding: 40px 0 4px; }
.tsn-footer-logo img { border-radius: 50%; width: 150px; height: 150px; box-shadow: 0 0 0 4px rgba(217,164,65,.35); }
.tsn-footer-links { margin-top: 22px; font-size: 14px; letter-spacing: .4px; }
.tsn-footer-links a { color: #CFC7BC; text-decoration: none; }
.tsn-footer-links a:hover { color: #E8DFD2; text-decoration: underline; }
.tsn-footer-links span { color: #6f675e; margin: 0 12px; }
.tsn-about-logo { margin-bottom: 8px; }

/* Center the branding in the header row (nav stays right on desktop, hamburger right on mobile) */
#masthead .site-header-row { grid-template-columns: 1fr auto 1fr !important; }
#masthead .site-header-main-section-left { grid-column: 2; justify-content: center; }
#masthead .site-header-main-section-right { grid-column: 3; }

/* Round nest icon beside the header wordmark */
.site-branding .site-title::before {
  content: "";
  display: inline-block;
  width: 40px; height: 40px;
  margin-right: 11px;
  vertical-align: -11px;
  background: url('https://thesundaynest.com/wp-content/uploads/2026/07/site-icon-512.png') center/cover no-repeat;
}

/* About page: the logo + "Hi, welcome" line open the page — Kadence's "About" title
   banner above the card is redundant and creates a dead gap. */
body.page-id-9 .entry-header { display: none; }
body.page-id-9 .content-area { padding-top: 28px !important; margin-top: 0 !important; }

/* ---------- Affiliate disclosure box (auto-inserted by functions.php) ---------- */
.tsn-disclosure {
  font-size: 13px;
  color: #6f6558;
  background: var(--tsn-linen);
  border-left: 3px solid var(--tsn-honey);
  padding: 10px 14px;
  border-radius: 0 8px 8px 0;
  margin-bottom: 28px;
}

/* ---------- Product card (roundup format, mirrors mockup) ---------- */
.tsn-products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 18px;
  margin: 24px 0;
}
.tsn-prod {
  background: var(--tsn-white);
  border: 1px solid #EAE0CE;
  border-radius: 12px;
  padding: 14px;
  text-align: center;
  display: flex;
  flex-direction: column;
}
.tsn-prod img { border-radius: 8px; margin-bottom: 12px; }
.tsn-prod .tsn-prod-name { font-size: 14px; font-weight: 600; line-height: 1.35; }
.tsn-prod .tsn-prod-price { color: #867B6E; font-size: 12px; margin: 4px 0 12px; }
.tsn-prod .tsn-shop {
  margin-top: auto;
  display: inline-block;
  background: var(--tsn-honey-deep);
  color: var(--tsn-white);
  border-radius: 8px;
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.tsn-prod .tsn-shop:hover { background: var(--tsn-olive-deep); }
.tsn-prod .tsn-prod-blurb { font-size: 13px; color: #6f6558; margin: 0 0 12px; }

/* ---------- Roundup blocks: quick picks, methodology, FAQ (SPEC 6 upgrades) ---------- */
.tsn-quickpicks {
  background: var(--tsn-linen);
  border: 1px solid #E5DAC2;
  border-radius: 14px;
  padding: 20px 24px;
  margin: 28px 0;
}
.tsn-quickpicks .tsn-box-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 20px;
  margin: 0 0 12px;
}
.tsn-quickpicks ul { margin: 0; padding-left: 20px; }
.tsn-quickpicks li { margin: 6px 0; font-size: 15px; }
.tsn-quickpicks li strong { color: var(--tsn-olive-deep); }

.tsn-method {
  background: var(--tsn-white);
  border-left: 3px solid var(--tsn-olive);
  border-radius: 0 10px 10px 0;
  padding: 16px 20px;
  margin: 24px 0;
  font-size: 14px;
  color: #55503f;
}
.tsn-method .tsn-box-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 17px;
  color: var(--tsn-charcoal);
  margin: 0 0 8px;
}
.tsn-method p { margin: 0 0 8px; }
.tsn-method p:last-child { margin-bottom: 0; }

.tsn-faq h3 { font-size: 18px; }
.entry-content .wp-block-table { overflow-x: auto; }
.entry-content .wp-block-table table { font-size: 14px; }
.entry-content .wp-block-table th {
  background: var(--tsn-linen);
  font-weight: 600;
}

/* ---------- Email opt-in block ---------- */
.tsn-magnet {
  background: var(--tsn-white);
  border: 1px solid #E5DAC2;
  border-radius: 14px;
  padding: 22px 24px;
  box-shadow: 0 8px 28px rgba(46, 42, 38, .07);
  margin: 32px auto;
}
.tsn-magnet strong { font-family: 'Playfair Display', Georgia, serif; font-size: 19px; }