/* Mobile Header Breakpoint */
@media (max-width: 900px) {
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }
}

/* Mobile Nav Drawer */
.wp-block-navigation__responsive-container.is-menu-open {
  width: 70% !important;
  min-width: unset !important;
  left: auto !important;
  right: 0 !important;
  height: auto !important;
  min-height: unset !important;
}

/* Mobile Featured Images (single posts only) */
@media (max-width: 768px) {
  body.single .wp-block-post-featured-image img {
    aspect-ratio: 4/3;
    object-fit: cover;
  }
}

/* Homepage Hero Stack */
@media (max-width: 780px) {
  .bfo-hero.wp-block-media-text.is-stacked-on-mobile {
    grid-template-columns: 100% !important;
  }
  .bfo-hero.is-stacked-on-mobile .wp-block-media-text__media {
    grid-column: 1;
    grid-row: 1;
    min-height: 300px;
  }
  .bfo-hero.is-stacked-on-mobile .wp-block-media-text__content {
    grid-column: 1;
    grid-row: 2;
  }
}

/* H1 Scaling Fix */
:root {
  --wp--preset--font-size--huge: clamp(28px, 1.75rem + ((1vw - 3.2px) * 1.364), 40px) !important;
}

/* H4 Scaling on Search and Archive */
.search .wp-block-query .wp-block-post-title,
.archive .wp-block-query .wp-block-post-title {
    font-size: var(--wp--preset--font-size--custom-2) !important;
}

/* H2 Archer, excluding recipe card */
body.single-post .wp-block-post-content h2:not(.wprm-recipe-name) {
  font-family: "archer-pro", serif !important;
  font-weight: 600;
  font-style: normal;
	color: #cc5500 !important;
}

/* hide pages from search results | 38075901-hc [MQ] */
.search-results .type-page {
	display: none;
}

/* search icon */
.wp-block-search__inside-wrapper input.wp-block-search__input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 12px center;
    background-size: 16px;
    padding-left: 38px;
}

/* Mobile Query Loop: 2 columns on archive and search only */
@media (max-width: 768px) {
  body.archive .wp-block-post-template.is-layout-grid,
  body.search .wp-block-post-template.is-layout-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--wp--preset--spacing--40) !important;
  }
}

/* All Recipes Query Loop Card BG Color */
.bfo-grid .wp-block-post {
  background: #F7F2E9;
}

/* General Query Loop Card BG Color */
.wp-block-post { background: #F6F6F6; }

/* Query Loop Pagination */
.wp-block-query-pagination {
  gap: 4px !important;
}

.wp-block-query-pagination-numbers a,
.wp-block-query-pagination-numbers .current {
  margin: 0 2px !important;
  padding: 4px 8px;
  display: inline-block;
  text-decoration: none;
}

.wp-block-query-pagination-numbers .current {
  font-weight: bold;
}

/* Page subheading */
.page-subheading {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  text-wrap: balance;
}

/* Button hover colors (theme variables) */
:root {
  /* Filled buttons: hover background */
  --wp--custom--button--hover--color--background: #5a2f14;
  /* Outline buttons: hover background and text */
  --wp--custom--button--outline--hover--color--background: transparent;
  --wp--custom--button--outline--hover--color--text: #785944;
}

/* Outline buttons: smooth fade and light tint on hover */
.wp-block-button[class*="is-style-outline"] > .wp-block-button__link {
  transition: background-color 0.2s ease, color 0.2s ease;
}
.wp-block-button[class*="is-style-outline"] > .wp-block-button__link:not([style*="border-bottom"]):hover {
  background-color: rgba(85, 46, 25, 0.1);
}

/* Term description */
.wp-block-term-description p {
  font-size: inherit;
}

/* Category Term blocks */
.recipe-cat-buttons a {
    display: inline-block !important;
    padding: 10px 16px !important;
    margin: 4px 8px 8px 0 !important;
    background-color: transparent !important;
    color: #552E19 !important;
    border: 2px solid #552E19 !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease-in-out;
}

.recipe-cat-buttons a:hover {
    background-color: rgba(85, 46, 25, 0.1) !important;
    color: #552E19 !important;
    text-decoration: none !important;
}

/* =========================
   COMMENTS
   ========================= */

/* Form title and cancel link: shared label style */
.comment-reply-title,
#cancel-comment-reply-link {
    font-family: var(--wp--preset--font-family--figtree), sans-serif;
    font-size: 0.88rem !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    line-height: 1.2;
}

#cancel-comment-reply-link {
    display: inline-block;
    margin-left: 10px;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.comment-reply-title {
    display: block;
    margin-top: 1.5rem !important;
    margin-bottom: 0.75rem !important;
}

/* Spacing around existing comments */
.wp-block-comment-content {
    padding-top: 0 !important;
    margin-top: 5px !important;
}

.wp-block-comment-content p:first-child {
    margin-top: 10px !important;
}

/* Comment form */
#commentform {
    margin-top: 0 !important;
}

#commentform label {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

#commentform .comment-notes {
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

/* Fields: white background */
#commentform textarea,
#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"] {
    background-color: #ffffff;
}

/* Shorter comment box */
#commentform textarea {
    height: 6rem;
    min-height: 0;
}

/* Narrower name, email, website fields on desktop */
@media (min-width: 782px) {
    #commentform input[type="text"],
    #commentform input[type="email"],
    #commentform input[type="url"] {
        max-width: 420px;
    }
}

/* Softer brand-color focus */
#commentform textarea:focus,
#commentform input[type="text"]:focus,
#commentform input[type="email"]:focus,
#commentform input[type="url"]:focus {
    border-color: #B39376;
    outline-offset: 0;
}

/* Cookie checkbox */
#commentform .comment-form-cookies-consent {
    align-items: center;
    gap: 0.5em;
}

#commentform .comment-form-cookies-consent label {
    text-transform: none;
    letter-spacing: normal;
    font-size: 0.85rem;
}

#commentform .comment-form-cookies-consent input[type="checkbox"] {
    margin: 0;
}

/* ConvertKit Form Trigger */
.convertkit-formtrigger {
  font-weight: 600 !important;
  border: 2px solid #3D1F11 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  color: #3D1F11 !important;
}

.convertkit-formtrigger:hover {
  background-color: rgba(61, 31, 17, 0.1) !important;
}

/* Post Related Grid */
.jp-related-posts-i2__list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  list-style: none !important;
}

/* In-Content Links */
body.single .entry-content a {
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-decoration-color: #3D1F11 !important;
    text-underline-offset: 4px;
}

body.single .entry-content .wprm-recipe-print,
body.single .entry-content .wprm-recipe-pin,
body.single .entry-content .wprm-recipe-button {
    text-decoration: none !important;
}

/* WP Form Field */
.wp-block-jetpack-contact-form input[type="text"],
.wp-block-jetpack-contact-form input[type="email"],
.wp-block-jetpack-contact-form textarea {
  background-color: #fff;
	border: 1px solid #d9d0c3;
}

/* Comment and contact form text areas: full width, vertical resize only */
textarea {
  width: 100%;
  box-sizing: border-box;
  resize: vertical;
}