/* ==========================================================================
   FPB Frontend Styles
   Supplemental CSS for the Gutenberg block homepage.
   This file is enqueued by the plugin when activated.
   Once you're happy with the result, you can copy these styles to
   Appearance > Customize > Additional CSS and deactivate the plugin.
   ========================================================================== */

/* -- Responsive adjustments -- */
@media (max-width: 781px) {
    .wp-block-cover {
        min-height: 350px !important;
    }

    .wp-block-cover .wp-block-post-title {
        font-size: 1.75rem !important;
    }

    .wp-block-columns {
        gap: 1rem !important;
    }
}

@media (max-width: 600px) {
    .wp-block-cover {
        min-height: 280px !important;
    }

    .wp-block-cover .wp-block-post-title {
        font-size: 1.5rem !important;
    }
}

/* -- Card hover effects -- */
.wp-block-query .wp-block-group {
    transition: background-color 0.15s ease;
}

.wp-block-query .wp-block-post-featured-image img {
    transition: transform 0.2s ease;
}

.wp-block-query .wp-block-group:hover .wp-block-post-featured-image img {
    transform: scale(1.02);
}

/* -- Smooth anchor transitions -- */
a {
    transition: color 0.15s ease;
}

/* -- Better image handling in query loops -- */
.wp-block-post-featured-image {
    overflow: hidden;
    border-radius: 6px;
}

.wp-block-post-featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* -- Post date and meta styling -- */
.wp-block-post-date,
.wp-block-post-author-name {
    color: #999;
}

/* -- Sidebar cards spacing fix -- */
.wp-block-column .wp-block-group + .wp-block-group {
    margin-top: 1.5rem;
}

/* -- Social links in sidebar -- */
.wp-block-social-links .wp-social-link {
    transition: transform 0.15s ease;
}
.wp-block-social-links .wp-social-link:hover {
    transform: scale(1.1);
}

/* -- Latest comments in sidebar -- */
.wp-block-latest-comments {
    padding-left: 0;
}

.wp-block-latest-comments__comment {
    list-style: none;
    padding-bottom: 0.75rem;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid #eee;
}

.wp-block-latest-comments__comment:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}