/*
Theme Name: Toque Coaching
Theme URI: https://toquecoach.com/
Author: Toque Coaching
Author URI: https://toquecoach.com/
Description: Bold and dark block theme for Toque Coaching: black header and footer, Toque blue accents, full-width photo hero.
Version: 1.0.21
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: toque
*/

/* Small extras that theme.json can't express. */

/* Page banner only when the page has a featured image (no grey title band otherwise) */
body.page .toque-page-hero:not(:has(img)) { display: none !important; }

/* No white gap between header, banner/title band, content and footer */
.wp-site-blocks > * + * { margin-block-start: 0 !important; }

/* Sticky dark header (on the template-part wrapper so it sticks for the whole page) */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 100; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; } }
@media (max-width: 600px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; } }

/* Logo */
.toque-logo img { display: block; width: 64px; height: auto; }

/* Menu links: blue underline on hover / current page */
.toque-header .wp-block-navigation-item__content { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8rem; font-weight: 700; padding: 0.35em 0; border-bottom: 2px solid transparent; }
.toque-header .wp-block-navigation-item__content:hover,
.toque-header .current-menu-item > .wp-block-navigation-item__content { border-bottom-color: var(--wp--preset--color--blue); text-decoration: none; }

/* Hero title shadow so it reads over any photo */
.toque-hero .wp-block-post-title { text-shadow: 0 2px 24px rgba(0,0,0,0.45); }

/* Footer link colours */
.toque-footer a { text-decoration: none; }
.toque-footer a:hover { color: var(--wp--preset--color--blue) !important; text-decoration: underline; }
.toque-footer ul { list-style: none; padding-left: 0; }
.toque-footer li { margin-bottom: 0.35rem; }

/* Blog cards */
.toque-post-card { border-bottom: 1px solid var(--wp--preset--color--line); padding-bottom: 1.5rem; }

/* Page banners: show the upper part of the photo, lighter overlay */
.toque-page-hero .wp-block-cover__image-background { object-position: 50% 20% !important; }
.toque-page-hero .wp-block-post-title { text-shadow: 0 2px 18px rgba(0,0,0,0.55); }

/* Story cards (Stories page + category/archive pages) */

  /* Toque Coaching – Stories page (tst- classes) – 2026-10-11 */
  .tst { font-size: 16px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; color: #1a1a1a; line-height: 1.6; }
  .tst * { box-sizing: border-box; }
  /* Break out of narrow content columns */
  .tst { position: relative; left: 50%; width: min(1100px, calc(100vw - 32px)) !important; max-width: none !important; margin-left: calc(min(1100px, calc(100vw - 32px)) / -2) !important; margin-right: 0 !important; margin-top: 8px !important; margin-bottom: 56px !important; }
  .tst a { box-shadow: none !important; }

  /* Filter chips (category list) */
  .tst-label { font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 12.8px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #0b6fae; margin: 0 0 10px !important; }
  .tst ul.tst-filter { list-style: none !important; display: flex; flex-wrap: wrap; gap: 8px; padding: 0 !important; margin: 0 0 30px !important; }
  .tst ul.tst-filter li { margin: 0 !important; font-size: 0; }
  .tst ul.tst-filter li a { display: inline-block; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 13px; font-weight: 700; padding: 7px 14px; border-radius: 999px; background: #f1f1ef; border: 1px solid #e0e0dc; color: #1a1a1a !important; text-decoration: none !important; transition: background-color .2s ease, border-color .2s ease; }
  .tst ul.tst-filter li a:hover { background: #e3f3fd; border-color: #2aa8f2; color: #0b5a8c !important; }
  .tst ul.tst-filter li { font-size: 12px; color: #6b6b6b; }

  /* Story cards */
  .tst .tst-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 18px !important; padding: 0 !important; margin: 0 !important; list-style: none !important; }
  .tst .tst-grid > li { margin: 0 !important; display: flex; }
  .tst .tst-card { display: flex; flex-direction: column; width: 100%; background: #f6f6f4; border: 1px solid #e5e5e2; border-radius: 12px; overflow: hidden; margin: 0 !important; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background-color .2s ease; }
  .tst .tst-card:hover { transform: translateY(-3px); border-color: #2aa8f2; background: #fff; box-shadow: 0 14px 30px rgba(13,13,13,0.08); }
  /* One image per article: featured image, or a branded tile when the post has none */
  .tst .tst-img { margin: 0 !important; aspect-ratio: 16 / 9; overflow: hidden; background: #e9e9e6; }
  .tst .tst-img img { width: 100% !important; height: 100% !important; object-fit: cover; object-position: 50% 10%; display: block; } /* favour the top of the photo so heads stay in frame */
  .tst .tst-card:not(:has(.tst-img img))::before { content: ""; display: block; aspect-ratio: 16 / 9; background: #0d0d0d url("https://toquecoach.com/wp-content/uploads/2026/04/cropped-cropped-Toque-Logo-2023.png") center / 84px no-repeat; border-bottom: 4px solid #2aa8f2; }
  .tst .tst-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; margin: 0 !important; }
  .tst .tst-body > * { margin: 0 !important; }
  /* Category chips on each card */
  .tst .tst-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px !important; font-size: 0; }
  .tst .tst-chips a { display: inline-block; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 10.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; background: #e3f3fd; color: #0b5a8c !important; text-decoration: none !important; }
  .tst .tst-chips a:hover { background: #2aa8f2; color: #0d0d0d !important; }
  .tst .tst-chips .wp-block-post-terms__separator { display: none; }
  .tst .tst-title { font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 18px !important; font-weight: 800; line-height: 1.3; }
  .tst .tst-title a { color: #0d0d0d !important; text-decoration: none !important; }
  .tst .tst-title a:hover { color: #0b6fae !important; }
  .tst .tst-date { font-size: 12.5px; color: #6b6b6b; margin-top: 6px !important; }
  .tst .tst-excerpt { margin-top: 10px !important; display: flex; flex-direction: column; flex: 1; }
  .tst .tst-excerpt .wp-block-post-excerpt__excerpt { font-size: 14.5px; color: #4a4a4a; line-height: 1.6; margin: 0 0 14px; }
  .tst .tst-excerpt .wp-block-post-excerpt__more-text { margin: auto 0 0; }
  .tst .tst-excerpt .wp-block-post-excerpt__more-link { font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 12.5px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #0b6fae !important; text-decoration: none !important; }

  /* Pagination */
  .tst .wp-block-query-pagination { margin-top: 30px !important; gap: 8px; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-weight: 700; font-size: 14px; }
  .tst .wp-block-query-pagination a, .tst .wp-block-query-pagination .page-numbers { text-decoration: none !important; color: #0d0d0d; padding: 6px 12px; border-radius: 6px; border: 1px solid #e5e5e2; background: #fff; }
  .tst .wp-block-query-pagination .page-numbers.current { background: #0d0d0d; color: #fff; border-color: #0d0d0d; }
  .tst .wp-block-query-pagination a:hover { border-color: #2aa8f2; }

  @media (max-width: 900px) { .tst .tst-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
  @media (max-width: 600px) { .tst .tst-grid { grid-template-columns: 1fr !important; } .tst-intro { padding: 20px; } }
  @media (prefers-reduced-motion: reduce) { .tst .tst-card { transition: none; } }

/* Topic pages: active chip (click to clear the filter) */
.tst ul.tst-filter li.current-cat a { background: #0d0d0d; border-color: #0d0d0d; color: #fff !important; }
.tst ul.tst-filter li.current-cat a:hover { background: #2aa8f2; border-color: #2aa8f2; color: #0d0d0d !important; }
.tst ul.tst-filter .tst-x { display: inline-block; margin-left: 8px; font-size: 15px; line-height: 1; font-weight: 800; vertical-align: -1px; }
.archive .wp-site-blocks > main, .archive main.wp-block-group { padding-top: 2.5rem; }

/* Article footer: previous / next story as two side-by-side cards */
.toque-postnav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 3rem !important; padding-top: 2rem; border-top: 1px solid #e5e5e2; }
.toque-postnav .post-navigation-link-previous, .toque-postnav .post-navigation-link-next { margin: 0 !important; display: flex; flex-direction: column; }
.toque-postnav .post-navigation-link-previous a, .toque-postnav .post-navigation-link-next a { flex: 1; }
.toque-postnav .post-navigation-link-next { grid-column: 2; text-align: right; }
.toque-postnav .post-navigation-link-previous a, .toque-postnav .post-navigation-link-next a { display: flex; flex-direction: column; gap: 4px; padding: 14px 18px; background: #f6f6f4; border: 1px solid #e5e5e2; border-radius: 12px; text-decoration: none !important; color: #0d0d0d !important; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 16px; font-weight: 800; line-height: 1.35; transition: border-color .2s ease, background-color .2s ease, transform .2s ease; }
.toque-postnav .post-navigation-link-next a { align-items: flex-end; }
.toque-postnav a:hover { background: #fff; border-color: #2aa8f2; transform: translateY(-2px); }
.toque-postnav .post-navigation-link__label { display: block; font-size: 11.5px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: #0b6fae; }
/* WP renders the arrows outside the link, which stretched the cards; draw them inside the label instead */
.toque-postnav .wp-block-post-navigation-link__arrow-previous, .toque-postnav .wp-block-post-navigation-link__arrow-next { display: none; }
.toque-postnav .post-navigation-link-previous .post-navigation-link__label::before { content: "\2190\00a0"; color: #2aa8f2; }
.toque-postnav .post-navigation-link-next .post-navigation-link__label::after { content: "\00a0\2192"; color: #2aa8f2; }
/* Back to the article's topic page (shortcode toque_topic_link in single.html) */
.toque-topic-link { margin: 0 0 14px !important; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 13px; font-weight: 700; }
.toque-topic-link a { color: #0b6fae !important; text-decoration: none !important; }
.toque-topic-link a:hover { color: #2aa8f2 !important; text-decoration: underline !important; }
.toque-topic-link--bottom { margin: 20px 0 0 !important; text-align: center; font-size: 14px; }
@media (max-width: 600px) { .toque-postnav { grid-template-columns: 1fr; } .toque-postnav .post-navigation-link-next { grid-column: 1; } }

/* Article header: topic chips, title, author · date (no banner) */
.toque-article-head { margin-bottom: 2.5rem !important; padding-bottom: 1.75rem; border-bottom: 1px solid #e5e5e2; }
.toque-article-head > * { margin-block-start: 0 !important; }
.toque-article-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px !important; font-size: 0; }
.toque-article-chips a { display: inline-block; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 11px; border-radius: 999px; background: #e3f3fd; color: #0b5a8c !important; text-decoration: none !important; }
.toque-article-chips a:hover { background: #2aa8f2; color: #0d0d0d !important; }
.toque-article-chips .wp-block-post-terms__separator { display: none; }
.toque-article-title { font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: clamp(30px, 4.2vw, 44px) !important; font-weight: 800; line-height: 1.15; letter-spacing: -0.01em; color: #0d0d0d; margin: 0 0 14px !important; }
@media (max-width: 600px) { .toque-article-title { font-size: 24px !important; line-height: 1.2; } }
.toque-article-meta { gap: 0 !important; align-items: center; font-size: 14px; color: #6b6b6b; margin: 0 !important; }
.toque-article-meta > * { margin: 0 !important; }
.toque-article-author { font-weight: 700; color: #1a1a1a; }
.toque-article-author::before { content: "By "; font-weight: 400; color: #6b6b6b; }
.toque-article-date::before { content: "·"; margin: 0 10px; color: #b5b5b0; }

/* Topic pages reuse the Stories banner + welcome box */
.toque-stories-hero-title { max-width: var(--wp--style--global--content-size, 720px); margin-left: auto !important; margin-right: auto !important; width: 100%; font-family: Montserrat, -apple-system, 'Segoe UI', sans-serif; font-size: var(--wp--preset--font-size--x-large, 44px) !important; font-weight: 800; line-height: 1.15; color: #fff; margin-top: 0 !important; margin-bottom: 0 !important; text-shadow: 0 2px 18px rgba(0,0,0,0.55); }
.tst .tst-intro { background: #eaf5fc; border: 1px solid #d3ebf9; border-radius: 12px; padding: 26px 30px; margin: 0 0 22px !important; font-size: 17px; line-height: 1.65; color: #2f2f2f; }
.tst .tst-intro a { color: #0b6fae; font-weight: 700; text-decoration: none; }
@media (max-width: 600px) { .tst .tst-intro { padding: 20px; } }

/* Same space above section headings on every custom page (matches About: 40px above, 16px below) */
.tca p.tca-label:not([style]), .tcp p.tcp-label:not([style]), .tcc p.tcc-label:not([style]), .tct p.tct-label:not([style]), .tcb p.tcb-label:not([style]) { margin: 40px 0 16px !important; }
.tca p.tca-label:first-child, .tcp p.tcp-label:first-child, .tcc p.tcc-label:first-child, .tct p.tct-label:first-child, .tcb p.tcb-label:first-child { margin-top: 0 !important; }

/* Topic anchor sits below the sticky header */
#topics { scroll-margin-top: 110px; }
.admin-bar #topics { scroll-margin-top: 142px; }

/* Banner text always white, even when WordPress marks the photo as light */
.toque-page-hero .wp-block-cover__inner-container, .toque-page-hero .toque-stories-hero-title, .toque-page-hero .wp-block-post-title, .toque-page-hero .wp-block-cover__inner-container * { color: #fff !important; }
