
@font-face {
  font-family: 'Figtree';
  font-display: swap !important;
}
@font-face {
  font-family: 'Lato';
  font-display: swap !important;
}

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


/* This is the version that worked for you—refined for a clean look */
.uagb-post__text {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 4px !important; /* Adjust this for the overall card gap */
}

.uagb-post__title {
    margin-bottom: 2px !important; /* Controls the space specifically under the Title */
}

.uagb-post__excerpt {
    margin-top: 0 !important;
}


/* 1. Remove the automatic 'Block Gap' from the pagination container */
.wp-block-query-pagination {
    gap: 4px !important; /* This is the main control for the space between blocks */
}

/* 2. Smaller, precise spacing for the numbers themselves */
.archive .wp-block-query-pagination-numbers a,
.archive .wp-block-query-pagination-numbers .current,
.search-results .wp-block-query-pagination-numbers a,
.search-results .wp-block-query-pagination-numbers .current {
    margin: 0 2px !important; /* Reduced from 8px to 2px */
    padding: 4px 8px; /* Slightly tighter padding */
    display: inline-block;
    text-decoration: none;
}

/* Optional: Style the 'Current' page number to stand out */
.wp-block-query-pagination-numbers .current {
    font-weight: bold;
}

/* Target the title and excerpt within a standard WP post grid */
.wp-block-post-title, 
.wp-block-post-excerpt {
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box; /* Ensures the 10px doesn't push the text outside the container */
}

/* Precise Spectra Post Grid Title Hover */
.uagb-post-grid .uagb-post__title a,
.wp-block-uagb-post-grid .uagb-post__title a {
    transition: color 0.3s ease-in-out !important;
}

.u-post-grid .uagb-post__title a:hover,
.wp-block-uagb-post-grid .uagb-post__title a:hover {
    color: #B39376 !important; /* Your new hover color */
    text-decoration: none !important;
}


/* More specific targeting for Spectra Term blocks */
.recipe-cat-buttons .uagb-post-grid-byline .uagb-post__taxonomy a,
.recipe-cat-buttons a {
    display: inline-block !important;
    padding: 10px 20px !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;
}


/* 1. Target the native WordPress social link anchor */
.wp-block-social-link .wp-block-social-link-anchor {
    display: flex !important;
    align-items: center !important;
    text-decoration: none !important;
}

/* 2. Target the native label span automatically */
.wp-block-social-link .wp-block-social-link-label {
    /* Un-hide the label globally */
    clip: unset !important;
    clip-path: none !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;

    /* Apply your H6 Style with White Text */
    display: inline-block !important;
    margin-left: 10px !important;
    font-family: "Figtree", sans-serif !important;
    font-size: 13px !important; 
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important; /* Slightly more space for white text on dark */
    color: #ffffff !important; 
    line-height: 1 !important;
}

/* This only affects the inside of the box, so the grid is safe */
.wp-block-post-template .wp-block-group {
    display: flex !important;
    flex-direction: column !important;
    height: 92% !important;
/* Makes the background color look professional */
}

/* Unify all comment labels and action links */
.comment-reply-title, 
.comment-reply-title a,
#cancel-comment-reply-link {
    font-family: var(--wp--preset--font-family--figtree), sans-serif; /* Using your headline font */
    font-size: 0.85rem !important; /* Matches a typical H6 size */
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
    line-height: 1.2;
}

/* Ensure the "Cancel Reply" specifically doesn't revert to a huge default */
#cancel-comment-reply-link {
    display: inline-block;
    margin-left: 10px;
    text-decoration: none;
}

/* Adjust spacing for the comment form title */
.comment-reply-title {
    margin-top: 1.5rem !important;  /* Reduces that "huge" top padding */
    margin-bottom: 0.75rem !important; /* Adds a clean gap before the input fields */
    display: block; /* Ensures the margin-bottom is respected */
}

/* Ensure the comment form itself doesn't have an extra top gap */
#commentform {
    margin-top: 0 !important;
}


/* Position caption directly below the image */
.swiper-slide .spectra-image-gallery__control-lightbox--caption {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: 12px !important;
    padding: 0 20px !important;
    background: transparent !important;
}

/* Style the caption link like an h4 */
.swiper-slide .spectra-image-gallery__control-lightbox--caption a {
    font-family: 'Figtree', sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    text-decoration: none !important;
    display: block !important;
}

/* Hover state */
.swiper-slide .spectra-image-gallery__control-lightbox--caption a:hover {
    color: #F5E6D3 !important;
    text-decoration: underline !important;
}

@media (max-width: 768px) and (orientation: portrait) {
    /* Let the image fill full width ignoring arrow space */
    .swiper-slide img {
        width: 100vw !important;
        height: auto !important;
        max-width: 100vw !important;
        object-fit: contain !important;
    }

    /* Push arrows to overlap the image edges instead of sitting outside */
    .swiper-button-next,
    .swiper-button-prev {
        top: 50% !important;
        transform: translateY(-50%) !important;
    }

    .swiper-button-prev {
        left: 4px !important;
    }

    .swiper-button-next {
        right: 4px !important;
    }
}

@media (max-width: 768px) and (orientation: portrait) {
    .swiper-slide img {
        width: 100vw !important;
        height: auto !important;
        max-width: 100vw !important;
        object-fit: contain !important;
    }

    .swiper-button-prev {
        left: 4px !important;
    }

    .swiper-button-next {
        right: 4px !important;
    }

    .swiper-button-prev,
    .swiper-button-next {
        filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.6)) !important;
    }
}

.jetpack-sharing-buttons__services-list {
    gap: 10px !important;
}