/*
Theme Name: Chanticleer 2025
Theme URI: https://chantireviews.com/
Description: Child theme of Twenty Twenty-Five. Gutenberg-first, minimal redundancy.
Author: Chanticleer
Version: 0.1.0
Template: twentytwentyfive
Text Domain: chanticleer-2025

Note:
- All custom styling is scoped to the front-end canvas (.wp-site-blocks)
  and the Site Editor canvas (.editor-styles-wrapper).
- This prevents accidental bleed into wp-admin UI.
*/

/* Scope helper */
:where(.wp-site-blocks, .editor-styles-wrapper) {
  /* no properties here; this selector is used to scope rules below */
}

/**********************************/
/* CAC section (Conference photos) */
/**********************************/
:where(.wp-site-blocks, .editor-styles-wrapper) .section-cac {
  padding: 3rem 1.5rem 4rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery {
  margin-bottom: 3rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-buttons {
  margin-top: 2.5rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cac img {
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}

/* Mobile: tighten padding + prevent gallery stacking oddly */
@media (max-width: 768px) {
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac {
    padding: 2.5rem 1.25rem 3.5rem;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery {
    margin-bottom: 2.5rem;
  }

    /* Mobile: gallery items were visually drifting left.
     Neutralize any default UL padding and center the gallery container/images. */
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery,
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery.has-nested-images {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery ul,
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery.has-nested-images {
    padding-left: 0 !important;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .wp-block-gallery .wp-block-image {
    margin-left: auto;
    margin-right: auto;
    justify-self: center;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .cac-gallery {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .cac-gallery .wp-block-image,
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cac .cac-gallery img {
    width: 100%;
    height: auto;
  }
}

/**********************************/
/* Services Cards section (3-up)   */
/**********************************/
:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards {
  padding: 3.5rem 1.5rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .wp-block-columns {
  align-items: stretch;
  gap: 2rem;
}

/* Strip default column border/padding so the inner .card controls look */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .wp-block-column {
  border: 0 !important;
  padding: 0 !important;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .card {
  height: 100%;
  padding: 2.25rem 1.75rem;
  border: 1px solid rgba(0, 0, 0, 0.10);
  border-radius: 12px;
  background-color: var(--wp--preset--color--chanticleer-cream-alt);
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
  .section-cards
  .wp-block-columns
  > .wp-block-column:nth-child(even)
  > .card {
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.10);
  background-color: #e8dfcf;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .card h2 {
  margin: 0.75rem 0;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .card .wp-block-buttons {
  margin-top: auto;
  padding-top: 1.5rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .card .wp-block-button__link {
  min-width: 12rem;
  text-align: center;
}

@media (hover: hover) and (pointer: fine) {
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.14);
  }
}

/**********************************/
/* Latest section (Latest Posts)   */
/**********************************/
:where(.wp-site-blocks, .editor-styles-wrapper) .section-latest {
  padding: 3.5rem 1.5rem 4rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-latest > .wp-block-heading {
  margin: 0 0 0.75rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-latest .latest-intro {
  max-width: 70ch;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.25rem;
}

/* The “pills” row */
:where(.wp-site-blocks, .editor-styles-wrapper) .latest-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem 0.6rem;
  margin: 0 auto 2.25rem;
  padding: 0;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .latest-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 0.9rem;
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 999px;
  text-decoration: none;
  line-height: 1.1;
  white-space: nowrap;
  background: transparent;
  transition: background-color 160ms ease, border-color 160ms ease, transform 120ms ease;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .latest-links a:hover {
  background-color: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.28);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .latest-links a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* Make “All Posts” the primary pill */
:where(.wp-site-blocks, .editor-styles-wrapper) .latest-links a.all-posts {
  background-color: var(--wp--preset--color--chanticleer-blue);
  border-color: var(--wp--preset--color--chanticleer-blue);
  color: #ffffff;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .latest-links a.all-posts:hover {
  filter: brightness(0.95);
}

/* Query Loop grid: force 3-up layout on wide screens */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-latest .wp-block-post-template.is-layout-grid,
:where(.wp-site-blocks, .editor-styles-wrapper) .section-latest ul.wp-block-post-template.is-layout-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

/* Card styling */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-latest .wp-block-post-template > li {
  position: relative; /* enables stretched-link */
  padding: 22px 20px 18px;
  border: 1px solid rgba(0, 0, 0, 0.10);
  border-radius: 12px;
  background-color: rgba(255, 255, 255, 0.45);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

/* Hover affordance – entire card feels clickable */
@media (hover: hover) and (pointer: fine) {
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-latest .wp-block-post-template > li:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.14);
  }
}

/* Featured image: unify size */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest figure.wp-block-post-featured-image {
  width: 120px;
  height: 120px;
  overflow: hidden;
  border-radius: 10px;
  margin: 0;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest figure.wp-block-post-featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-post-title {
  margin-top: 0.65rem;
  margin-bottom: 0;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-post-excerpt {
  margin-top: 0.8rem;
}

/* Stretched-link: make the whole card click to the post via the title link */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-post-title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Keep actual controls/links above the stretched-link overlay */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-read-more,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-post-featured-image a,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-post-title a {
  position: relative;
  z-index: 2;
}

@media (max-width: 1024px) {
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-latest .wp-block-post-template.is-layout-grid,
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-latest ul.wp-block-post-template.is-layout-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 782px) {
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-latest .wp-block-post-template.is-layout-grid,
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-latest ul.wp-block-post-template.is-layout-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-latest figure.wp-block-post-featured-image {
    width: 110px;
    height: 110px;
  }
}

/**********************************/
/* Newsletter / Mailchimp embed     */
/**********************************/
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter {
  padding: 3.5rem 1.5rem 4rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter .newsletter-intro {
  max-width: 70ch;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.75rem;
}

/* Mailchimp form wrapper */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup {
  width: min(720px, 100%);
  margin-left: auto;
  margin-right: auto;
  padding: 1.75rem 1.5rem;
  border: 1px solid rgba(0, 0, 0, 0.10);
  border-radius: 12px;
  background-color: rgba(255, 255, 255, 0.45);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup h2 {
  display: none; /* remove redundant embedded H2 */
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .mc-field-group {
  margin-bottom: 0.9rem;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup label {
  font-weight: 600;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup input[type="email"],
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup input[type="text"] {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  padding: 0.75rem 0.95rem;
  font-size: 1rem;
  line-height: 1.2;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.18);
  background-color: rgba(255, 255, 255, 0.85);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .button,
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup input[type="submit"] {
  background-color: var(--wp--preset--color--chanticleer-blue);
  border-radius: 999px;
  padding: 0.9rem 1.6rem;
  border: 1px solid var(--wp--preset--color--chanticleer-blue);
  color: #ffffff;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .button:hover,
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup input[type="submit"]:hover {
  filter: brightness(0.95);
}

/* Make the interest checkboxes feel less "Mailchimp default" */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .input-group ul {
  margin: 0.5rem 0 0;
  padding: 0;
  list-style: none;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .input-group li {
  margin: 0.35rem 0;
}

/* Optional: collapse long legal text if you wrap it in <details class="mc-legal"> */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter details.mc-legal {
  margin-top: 1.25rem;
  padding: 1.25rem;
  border: 2px solid rgba(0, 0, 0, 0.18);
  border-radius: 10px;
  background-color: rgba(255, 255, 255, 0.65);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter details.mc-legal summary {
  cursor: pointer;
  font-weight: 700;
}

/* Make the EMAIL consent checkbox visually prominent */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter .mc_fieldset label.checkbox {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 0.85rem;
  border: 2px solid var(--wp--preset--color--chanticleer-blue);
  border-radius: 10px;
  background-color: rgba(70, 100, 160, 0.08);
  font-weight: 700;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter .mc_fieldset input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  accent-color: var(--wp--preset--color--chanticleer-blue);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter .mc_fieldset label.checkbox span {
  line-height: 1.3;
}

/* Callout text explaining requirement */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter .mc_fieldset::before {
  content: "Required: we can only send emails if this box is checked.";
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--wp--preset--color--chanticleer-blue);
}
/* Prevent Mailchimp's default CSS from shrinking inputs/buttons */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup form {
  width: 100%;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .mc-field-group input,
:where(.wp-site-blocks, .editor-styles-wrapper) .section-newsletter #mc_embed_signup .mc-field-group select {
  margin: 0.25rem 0 0;
}

/**********************************/
/* Smoother section transitions     */
/**********************************/

/* Eliminate the "mystery band" caused by bottom margins + separators */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cac > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cards > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-newsletter > :last-child {
  margin-bottom: 0;
}

/* If a separator sits between sections, remove its default margins */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cac .wp-block-separator,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest .wp-block-separator,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cards .wp-block-separator,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-newsletter .wp-block-separator {
  margin-top: 0;
  margin-bottom: 0;
}

/* Your Services section ends with an explicit Spacer block (height:4rem).
   That is what's creating the huge gap band before the divider.
   Keep it modest so the transition feels intentional. */
:where(.wp-site-blocks, .editor-styles-wrapper) .section-cards .wp-block-spacer {
  height: 1.75rem !important;
}

/**********************************/
/* Section divider (brand + clean) */
/**********************************/

/* Brand divider: no spacing, just the line */
:where(.wp-site-blocks, .editor-styles-wrapper) hr.cbr-divider {
  border: 0;
  height: 0;

  border-top: 2px solid var(--wp--preset--color--chanticleer-brown);
  opacity: 1;

  /* divider itself adds NO spacing */
  margin: 0;
}

/* Safety: neutralize any inline margins Gutenberg might inject */
:where(.wp-site-blocks, .editor-styles-wrapper) hr.cbr-divider[style] {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/**********************************/
/* Section-level margin control    */
/**********************************/

/* Prevent Gutenberg from adding implicit top/bottom margins
   to the first and last blocks inside major sections */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cac > :first-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cards > :first-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-testimonials > :first-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest > :first-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-speakers > :first-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest > :first-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-newsletter > :first-child {
  margin-top: 0 !important;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cac > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-cards > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-testimonials > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-speakers > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-latest > :last-child,
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-newsletter > :last-child {
  margin-bottom: 0 !important;
}


/**********************************/
/* Testimonials: inner padding fix */

/* Remove Gutenberg global padding + width constraints inside testimonial cards
   (cards already provide their own padding) */
:where(.wp-site-blocks, .editor-styles-wrapper)
.section-testimonials .testimonial-card .wp-block-group.has-global-padding {
  padding: 0 !important;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.section-testimonials .testimonial-card .wp-block-group.is-layout-constrained {
  max-width: none !important;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.section-testimonials .testimonial-card
.wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
}


/**********************************/
/* Testimonials: mobile spacing
***********************************/

/* Remove remaining global block padding on testimonial cards (mobile only)
   Core applies ~24px padding via block supports on Groups. */
@media (max-width: 600px) {
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-testimonials .testimonial-card {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Ensure no nested group reintroduces side padding */
  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-testimonials .testimonial-card .wp-block-group {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/**********************************/
/* Testimonials: mobile spacing    */
/**********************************/

/* The screenshot shows generous side padding on small screens.
   Tighten the section + card padding on mobile so the content breathes
   without feeling “boxed in the middle.” */
@media (max-width: 600px) {
  :where(.wp-site-blocks, .editor-styles-wrapper) .section-testimonials {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-testimonials .wp-block-post-template > li {
    padding: 18px 16px 14px;
  }

  :where(.wp-site-blocks, .editor-styles-wrapper)
  .section-testimonials .wp-block-post-title {
    margin-top: 0.5rem;
  }
}


/**********************************/
/* Fullwidth children (Query Loop) */
/**********************************/

/*
  Gutenberg’s constrained layout adds container-scoped rules (core-block-supports-inline.css)
  that shrink inner content to ~75% and center it.

  For sections where you explicitly want children to run full width (inside the section padding),
  add the class: cbr-fullwidth-children

  This keeps normal constrained sections intact, but relaxes constraints for query loops (and their
  inner groups) inside the marked section.
*/

/* 1) Let direct children of the section use full width */
:where(.wp-site-blocks, .editor-styles-wrapper)
.cbr-fullwidth-children.wp-block-group.is-layout-constrained
> :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 2) Specifically: query loops shouldn't inherit centered, narrow containers */
:where(.wp-site-blocks, .editor-styles-wrapper)
.cbr-fullwidth-children .wp-block-query {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
}

/* 3) Inside query results, prevent nested Groups from reintroducing global side padding/constraints */
:where(.wp-site-blocks, .editor-styles-wrapper)
.cbr-fullwidth-children .wp-block-query .wp-block-group.has-global-padding {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.cbr-fullwidth-children .wp-block-query .wp-block-group.is-layout-constrained {
  max-width: none !important;
}

:where(.wp-site-blocks, .editor-styles-wrapper)
.cbr-fullwidth-children .wp-block-query .wp-block-group.is-layout-constrained
> :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
}

/* Mobile: slightly tighter section padding by default when using fullwidth children */
@media (max-width: 600px) {
  :where(.wp-site-blocks, .editor-styles-wrapper) .cbr-fullwidth-children {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}