/*
Theme Name:         Champlain 2026
Theme URI:          https://example.com/champlain2026
Description:        Community centre theme (vanilla PHP, no Acorn). Registers the program post type (/program/…) if not already registered by a plugin, and flushes permalinks once on theme switch. Expects ACF Pro for custom blocks; Gravity Forms for the footer newsletter; optional Display Posts shortcode. ACF field groups can ship in /acf-json. Block patterns: “Champlain 2026”.
Version:            1.0.3
Author:             Vincent Design
Author URI:         https://vincentdesign.ca/
Text Domain:        champlain2026
License:            MIT License
License URI:
Requires PHP:       7.3
Requires at least:  6.4
*/

/* Ensure header/footer icon styles apply (white background, circular, layout) */
#app header .circular-icon,
#app header a[class*="bg-white"].circular-icon,
#app .footer .circular-icon,
#app .footer a[class*="bg-white"].circular-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background-color: #fff;
  color: inherit;
  text-decoration: none;
}
@media (min-width: 1024px) {
  #app header .circular-icon,
  #app header a[class*="bg-white"].circular-icon,
  #app .footer .circular-icon,
  #app .footer a[class*="bg-white"].circular-icon {
    width: 3rem;
    height: 3rem;
  }
}
#app header .circular-icon:hover,
#app .footer .circular-icon:hover {
  opacity: 0.8;
}
#app header .circular-icon i,
#app .footer .circular-icon i {
  font-size: 1rem;
  line-height: 1;
}
@media (min-width: 1024px) {
  #app header .circular-icon i,
  #app .footer .circular-icon i {
    font-size: 1.25rem;
  }
}

/*
 * Drop-in: Core Query Loop → same “image left + text” layout as Display Posts
 * (.display-posts-listing.image-left in app.css). Applies inside page content only.
 * Requires a featured image on posts; uses :has() (all current evergreen browsers).
 */
@media (min-width: 768px) {
  /* ul or ol — core can output either depending on block settings */
  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image),
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) {
    display: grid !important;
    grid-template-columns: minmax(0, 55%) minmax(0, 45%);
    gap: 1.25rem;
    align-items: start;
  }

  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) .wp-block-post-featured-image,
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) .wp-block-post-featured-image {
    grid-column: 1;
    grid-row: 1 / -1;
    margin: 0;
  }

  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) .wp-block-post-featured-image img,
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) .wp-block-post-featured-image img {
    width: 100%;
    height: auto;
    max-height: 400px;
    object-fit: cover;
  }

  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-group,
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-group {
    grid-column: 2;
    align-self: start;
  }

  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-post-date,
  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-post-title,
  #app .content-wrapper .wp-block-query ul.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-post-excerpt,
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-post-date,
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-post-title,
  #app .content-wrapper .wp-block-query ol.wp-block-post-template > li.wp-block-post:has(.wp-block-post-featured-image) > .wp-block-post-excerpt {
    grid-column: 2;
  }
}

/* Optional wrapper: keeps calendar heading directly above the next block (embed/HTML). */
#app .content-wrapper .champlain2026-calendar-section > :first-child {
  margin-top: 0;
}