/* Defaults styles */

.wp-block-bbl-post-listing {
	/* Animation custom properties */
	--esm-init-delay: 0.1s;
	--esm-stagger-delay: 0.12s;
	--esm-transform: translateY(3rem);
	--esm: 1s var(--esm-init-delay) cubic-bezier(0.22, 0.61, 0.36, 1);
}

.wp-block-bbl-post-listing.has-background {
	padding-top: var(--wp--preset--spacing--50);
    padding-bottom: var(--wp--preset--spacing--50);
	overflow-x: hidden;
}
.wp-block-bbl-post-listing.alignfull {
	padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
}
.wp-block-bbl-post-listing .post-listing__posts {
	display: grid;
	grid-template-columns: repeat(1	, minmax(0, 1fr));
	gap: calc(var(--wp--custom--layout--block-gap, 30px) * 1.5) var(--wp--custom--layout--block-gap, 30px) ;
	/* gap: var(--wp--preset--spacing--20); */
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}
.wp-block-bbl-post-listing .post-listing__posts.post-type-project {
	gap: var(--wp--custom--layout--block-gap, 30px) ;
}


/* Staggered animation for grid posts */
.wp-block-bbl-post-listing .post-listing__posts.layout-grid article {
	position: relative;
	opacity: 0;
	transform: var(--esm-transform);
	transition: var(--esm);
	transition-property: opacity, transform;
}

/* Animated state */
.wp-block-bbl-post-listing .post-listing__posts.layout-grid article.is-animated {
	opacity: 1;
	transform: translateY(0);
}

/* Block header */
.wp-block-bbl-post-listing .post-listing__header {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
	margin-bottom: var(--space-m-l);
}
.wp-block-bbl-post-listing.has-foreground-background-color .post-listing__cta {
	color: var(--wp--preset--color--grey-1);
}


/* Feature 1st layout styles */
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__link {
	background-color: var(--wp--preset--color--foreground);
	color: var(--wp--preset--color--white);
}
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__link:hover .read-more {
	filter: brightness(85%);

}
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__content,
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__footer {
	padding-left: var(--space-xs-s);
	padding-right: var(--space-xs-s);
}
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__title {
	font-size: var(--wp--preset--font-size--x-large);
}
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__excerpt {
	font-size: var(--wp--preset--font-size--medium);
}
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .read-more {
	background-color: var(--wp--preset--color--theme-1);
    border-radius: 50px;
    border-width: 0;
    color: var(--wp--preset--color--white);
    font-size: var(--wp--preset--font-size--medium);
    font-weight: 700;
    padding: calc(0.55rem + 2px) 1.5rem calc(0.7rem + 2px);
}
.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .read-more svg {
	display: none;
}


/* Carousel layout styles */
.wp-block-bbl-post-listing .layout-carousel {
    display: block;
    position: relative;
    margin-bottom: 0;
	overflow: visible !important;
}

.wp-block-bbl-post-listing .layout-carousel .swiper-slide {
    height: auto;
}

.wp-block-bbl-post-listing .layout-carousel.theme-2 .swiper-slide {
	opacity: 0.3;
}
.wp-block-bbl-post-listing .layout-carousel.theme-2 .swiper-slide.swiper-slide-active {
	opacity: 1;
}

/* Swiper scrollbar */
.wp-block-bbl-post-listing .layout-carousel .swiper-scrollbar {
    position: relative;
    margin-top: 3rem;
    height: 4px;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 10px;
	width: 100%;
    left: 0;
}

.wp-block-bbl-post-listing .layout-carousel .swiper-scrollbar-drag {
    background: var(--wp--preset--color--foreground);
    border-radius: 10px;
    cursor: grab;
}

.wp-block-bbl-post-listing .layout-carousel .swiper-scrollbar-drag:active {
    cursor: grabbing;
}

/* Colour variations */
html:not([data-theme="dark"]) .wp-block-bbl-post-listing.has-foreground-background-color .post-summary__link {
	color: var(--wp--preset--color--background);
}

/* Default grid layout styles */
@media only screen and (min-width: 768px) {

	.wp-block-bbl-post-listing .post-summary {
		margin-bottom: 0;
	}

	.wp-block-bbl-post-listing .post-listing__header {
		flex-direction: row;
		align-items: flex-end;
	}

	.wp-block-bbl-post-listing .post-listing__posts.columns-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wp-block-bbl-post-listing .post-listing__posts.columns-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.wp-block-bbl-post-listing .post-listing__posts.columns-4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	/* feature first layouts */
	.wp-block-bbl-post-listing .post-listing__posts.columns-3.feature-first {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.wp-block-bbl-post-listing .post-listing__posts.columns-3.feature-first > *:first-child {
		grid-column: span 2;
	}
	.wp-block-bbl-post-listing .post-listing__posts.feature-first > *:first-child .post-summary__image img {
		aspect-ratio: 6/3.7;
	}

	/* Projects Layout - Theme 2 Layout */
	.wp-block-bbl-post-listing .post-listing__posts.post-type-project.theme-2 {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	.wp-block-bbl-post-listing .post-listing__posts.post-type-project.theme-2 .project-summary {
		grid-column: span 2;
	}
	.wp-block-bbl-post-listing .post-listing__posts.post-type-project.theme-2 .project-summary:nth-child(-n+2) {
		grid-column: span 3;
	}
	.wp-block-bbl-post-listing .post-listing__posts.post-type-project.theme-2 .project-summary:nth-child(-n+2) .post-summary__image img {
		   aspect-ratio: var(--wp--preset--aspect-ratio--wide-landscape);
	}
	/* Theme 2 carousel layout - 70% width slides with 10% gap */
	.wp-block-bbl-post-listing .post-listing__posts.layout-carousel.theme-2 .swiper-slide {
		width: 70%;
		margin-right: 10%;
	}

}


/* Editor Styles */
.editor-styles-wrapper .wp-block-bbl-post-listing a {
	pointer-events: none;
}
.editor-styles-wrapper .wp-block-bbl-post-listing article {
	opacity: 1 !important;
	transform: none !important;
}

/* Editor Styles - Carousel Mode */
.editor-styles-wrapper .wp-block-bbl-post-listing .layout-carousel .swiper-wrapper {
	display: flex;
	gap: 1rem;
	overflow-x: auto;
	overscroll-behavior-x: contain;
}
.editor-styles-wrapper .wp-block-bbl-post-listing .layout-carousel .swiper-slide {
	width: 33%;
	flex-shrink: 0;
}

/* Editor Styles - Theme 2 */
.editor-styles-wrapper .wp-block-bbl-post-listing .layout-carousel.theme-2 .swiper-wrapper {
	gap: 10%;
}
.editor-styles-wrapper .wp-block-bbl-post-listing .layout-carousel.theme-2 .swiper-slide {
	width: 70%;
}