/**
 * Posts Horizontal Slider Toggle block styles.
 *
 * @package made-to-thrive-2026-base
 */

.mtt-posts-horizontal-slider-toggle {
	width: 100%;
}

.mtt-phst__inner {
	width: 100%;
}

/* -------------------------------------------------------------------------
   Header — filter left, title center, button right
   ------------------------------------------------------------------------- */

.mtt-phst__header {
	align-items: center;
	box-sizing: border-box;
	display: grid;
	gap: 1rem 1.5rem;
	grid-template-columns: 1fr;
	grid-template-areas:
		"filter"
		"title"
		"action";
	margin-bottom: clamp(1.25rem, 3vw, 2rem);
	padding: clamp(0.75rem, 2vw, 1.25rem) 0;
	text-align: center;
	width: 95%;
    margin: 22px auto 15px;
    max-width: 1297px;
}

.mtt-phst__filter {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 25px;
	grid-area: filter;
	justify-content: flex-start;
}

.mtt-phst__filter-label {
	color: currentColor;
	font-family: var(--wp--preset--font-family--source-sans-3, "Source Sans 3", sans-serif);
	font-size: var(--wp--preset--font-size--13, 0.8125rem);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
}

.mtt-phst__filter-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.625rem 1.75rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mtt-phst__filter-item {
	margin: 0;
}

.mtt-phst__filter-option {
	align-items: center;
	background: none;
	border: 0;
	color: currentColor;
	cursor: pointer;
	display: inline-flex;
	font-family: var(--wp--preset--font-family--source-sans-3, "Source Sans 3", sans-serif);
	font-size: 15px;
	font-weight: 400;
	gap: 0.5rem;
	letter-spacing: 0;
	line-height: 1.3;
	padding: 0;
	text-align: left;
}

.mtt-phst__filter-option:hover,
.mtt-phst__filter-option:focus {
	opacity: 0.85;
}

.mtt-phst__filter-option:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.mtt-phst__filter-radio {
    border: 1px solid currentColor;
    border-radius: 50%;
    box-sizing: border-box;
    flex-shrink: 0;
    height: 14px;
    width: 14px;
}

.mtt-phst__filter-option.is-selected .mtt-phst__filter-radio {
	background-color: currentColor;
}

.mtt-phst__title {
	grid-area: title;
	justify-self: center;
	width: 100%;
}

.mtt-phst__title > .wp-block-heading {
	margin: 0;
	text-align: center;
	width: 100%;
}

.mtt-phst__action {
	grid-area: action;
	justify-self: center;
}

.mtt-phst__action > .wp-block-button {
	margin: 0;
}

/* .mtt-phst__action .wp-block-button__link {
	background: transparent;
	border: 1px solid currentColor;
	color: inherit;
	font-family: var(--wp--preset--font-family--la-roue, "La Roue", serif);
	font-size: clamp(0.75rem, 1.2vw, 0.875rem);
	font-weight: 400;
	letter-spacing: 0.08em;
	padding: 0.625rem 1.25rem;
	text-transform: uppercase;
} */
/* 
.mtt-phst__action .wp-block-button__link:hover,
.mtt-phst__action .wp-block-button__link:focus-visible {
	background: currentColor;
	color: var(--wp--preset--color--white, #fff);
	outline: 2px solid currentColor;
	outline-offset: 2px;
} */

@media (min-width: 768px) {
	.mtt-phst__header {
		align-items: center;
		grid-template-columns: minmax(0, 1fr) minmax(0, auto) minmax(0, 1fr);
		grid-template-areas: "filter title action";
		text-align: left;
	}

	.mtt-phst__title {
		justify-self: center;
	}

	.mtt-phst__action {
		justify-self: end;
	}
}

/* Editor header stacks InnerBlocks */
.mtt-posts-horizontal-slider-toggle.is-editor .mtt-phst__header {
	display: block;
}

.mtt-posts-horizontal-slider-toggle.is-editor .mtt-phst__header .block-editor-inner-blocks {
	width: 100%;
}

/* -------------------------------------------------------------------------
   Panels
   ------------------------------------------------------------------------- */

.mtt-phst__panels {
	width: 100%;
}

.mtt-phst__panel {
	width: 100%;
}

.mtt-phst__empty {
	font-family: var(--wp--preset--font-family--source-sans-3, "Source Sans 3", sans-serif);
	font-size: 0.875rem;
	margin: 0;
}

.mtt-phst__preview {
	margin: 0;
}

.mtt-phst__preview img {
	display: block;
	height: auto;
	width: 100%;
}

/* -------------------------------------------------------------------------
   Swiper
   ------------------------------------------------------------------------- */

.mtt-phst__slider-wrap {
	width: 100%;
}

.mtt-phst__swiper {
	height: auto !important;
	overflow: hidden;
	width: 100%;
}

.mtt-phst__swiper:not(.swiper-initialized) .swiper-wrapper {
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
}

.mtt-phst__swiper:not(.swiper-initialized) .swiper-slide {
	flex: 0 0 calc(100% / 3.5);
	min-width: 0;
}

.mtt-phst__swiper .swiper-wrapper {
	align-items: stretch;
}

.mtt-phst__swiper .swiper-slide {
	height: auto !important;
}

.mtt-phst__slide {
	height: auto;
}

/* -------------------------------------------------------------------------
   Archive overlay post cards (scoped)
   ------------------------------------------------------------------------- */

.mtt-posts-horizontal-slider-toggle .post-card--overlay {
	margin: 0;
	min-width: 0;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__link {
	color: inherit;
	display: block;
	text-decoration: none;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--espresso, #4C3600);
	outline-offset: -2px;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__media {
	overflow: hidden;
	position: relative;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__media::after {
	background-color: rgba(0, 0, 0, 0);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	transition: background-color 0.25s ease;
	z-index: 1;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__link:hover .post-card__media::after,
.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__link:focus .post-card__media::after {
	background-color: rgba(0, 0, 0, 0.3);
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__image,
.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__media .image-fit {
	aspect-ratio: 260 / 328;
	display: block;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__image--placeholder {
	background-color: var(--wp--preset--color--cream, #ECDAC6);
	display: block;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__overlay {
	align-items: left;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.35) 45%, transparent 100%);
	bottom: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	justify-content: flex-end;
	left: 0;
	padding: clamp(1.25rem, 4vw, 2rem) clamp(1rem, 3vw, 1.5rem);
	position: absolute;
	right: 0;
	text-align: center;
	z-index: 2;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__category {
	color: var(--wp--preset--color--white, #FFFFFF);
	font-family: var(--wp--preset--font-family--true-fate-script, "True Fate Script", cursive);
	font-size: 20px;
	font-weight: 400;
	line-height: 1.2;
	margin: 0;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__title {
	color: var(--wp--preset--color--white, #FFFFFF);
	font-family: var(--wp--preset--font-family--la-roue, "La Roue", serif);
	font-size: 35px;
    font-weight: 400;
    line-height: 30px;
    margin: 0;
    text-align: left;
    letter-spacing: 0;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__cta {
    align-items: center;
    color: var(--wp--preset--color--white, #FFFFFF);
    display: inline-flex;
    font-family: var(--wp--preset--font-family--source-sans-3);
    font-size: 13px;
    font-weight: 700;
    gap: 0.5rem;
    letter-spacing: 0.05rem;
    line-height: 1.2;
    margin-top: 0.25rem;
    text-transform: uppercase;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__cta .read-post-arrow {
	flex-shrink: 0;
}

.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__link:hover .post-card__cta,
.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__link:focus .post-card__cta {
	text-decoration: underline;
}

/* -------------------------------------------------------------------------
   Custom scrollbar
   ------------------------------------------------------------------------- */

.mtt-posts-horizontal-slider-toggle .mtt-phst__scrollbar,
.mtt-posts-horizontal-slider-toggle .swiper-horizontal > .swiper-scrollbar,
.mtt-posts-horizontal-slider-toggle .swiper-scrollbar.swiper-scrollbar-horizontal {
	position: relative;
	left: 0;
	right: auto;
	bottom: auto;
	width: 100%;
	max-width: 352px;
	margin: 3.2rem auto 60px;
	height: 1px;
	background: currentColor;
	border-radius: 0;
}

.mtt-phst__scrollbar.swiper-scrollbar {
	opacity: 1 !important;
}

.mtt-phst__scrollbar .swiper-scrollbar-drag {
	top: -12px;
	height: 24px;
	width: 24px !important;
	margin-top: -0.4375rem;
	background-color: #EBDAC6;
	border: 1px solid currentColor;
	border-radius: 50%;
	cursor: grab;
	box-sizing: border-box;
}

.mtt-phst__scrollbar .swiper-scrollbar-drag::after {
	content: "";
	position: absolute;
	top: calc(100% + 11px);
	left: 50%;
	transform: translateX(-50%);
	width: 19.965px;
	height: 7.748px;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2219.965%22%20height%3D%227.748%22%20viewBox%3D%220%200%2019.965%207.748%22%3E%3Cg%20id%3D%22Group_88%22%20data-name%3D%22Group%2088%22%20transform%3D%22translate%28-531.742%20-1272.126%29%22%3E%3Cg%20id%3D%22arrow-right-svgrepo-com_1_%22%20data-name%3D%22arrow-right-svgrepo-com%20%281%29%22%20transform%3D%22translate%28521.399%201248.48%29%22%3E%3Cpath%20id%3D%22Path_317%22%20data-name%3D%22Path%20317%22%20d%3D%22M44%2C31.04l3.52-3.52L44%2C24%22%20transform%3D%22translate%28-17.919%29%22%20fill%3D%22none%22%20stroke%3D%22%234d3700%22%20stroke-width%3D%221%22%2F%3E%3Cline%20id%3D%22Line_21%22%20data-name%3D%22Line%2021%22%20x1%3D%2217.276%22%20transform%3D%22translate%2812%2027.585%29%22%20fill%3D%22none%22%20stroke%3D%22%234d3700%22%20stroke-width%3D%221%22%2F%3E%3C%2Fg%3E%3Cg%20id%3D%22arrow-right-svgrepo-com_1_2%22%20data-name%3D%22arrow-right-svgrepo-com%20%281%29%22%20transform%3D%22translate%28562.051%201303.52%29%20rotate%28180%29%22%3E%3Cpath%20id%3D%22Path_317-2%22%20data-name%3D%22Path%20317%22%20d%3D%22M44%2C31.04l3.52-3.52L44%2C24%22%20transform%3D%22translate%28-17.919%29%22%20fill%3D%22none%22%20stroke%3D%22%234d3700%22%20stroke-width%3D%221%22%2F%3E%3Cline%20id%3D%22Line_21-2%22%20data-name%3D%22Line%2021%22%20x1%3D%2217.276%22%20transform%3D%22translate%2812%2027.585%29%22%20fill%3D%22none%22%20stroke%3D%22%234d3700%22%20stroke-width%3D%221%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	pointer-events: none;
}

.mtt-phst__scrollbar .swiper-scrollbar-drag:active {
	cursor: grabbing;
}

/* -------------------------------------------------------------------------
   Editor sidebar / placeholder
   ------------------------------------------------------------------------- */

.mtt-phst-editor__limit-note {
	color: #757575;
	font-size: 0.8125rem;
	margin: 0 0 0.75rem;
}

.mtt-phst-editor__selected-list {
	list-style: none;
	margin: 0.75rem 0 0;
	padding: 0;
}

.mtt-phst-editor__selected-item {
	align-items: center;
	border-bottom: 1px solid #e0e0e0;
	display: flex;
	gap: 0.5rem;
	justify-content: space-between;
	padding: 0.375rem 0;
}

.mtt-phst-editor__selected-item:last-child {
	border-bottom: none;
}

.mtt-phst-editor__selected-actions {
	align-items: center;
	display: flex;
	flex-shrink: 0;
	gap: 0.25rem;
}

.mtt-phst-editor__placeholder {
	margin: 0;
}

@media (prefers-reduced-motion: reduce) {
	.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__image,
	.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__media .image-fit {
		transition: none;
	}
}

@media (max-width: 880px) {
	.mtt-posts-horizontal-slider-toggle:not(.is-editor) .mtt-phst__header {
		grid-template-areas:
			"title"
			"filter";
		grid-template-columns: 1fr;
		text-align: center;
	}

	.mtt-posts-horizontal-slider-toggle:not(.is-editor) .mtt-phst__title {
		justify-self: center;
	}

	.mtt-posts-horizontal-slider-toggle:not(.is-editor) .mtt-phst__action {
		display: none;
	}

	.mtt-posts-horizontal-slider-toggle:not(.is-editor) .mtt-phst__filter,
	.mtt-posts-horizontal-slider-toggle:not(.is-editor) .mtt-phst__filter-list {
		justify-content: center;
	}
}

@media (max-width: 500px) {
	.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__image,
	.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__media .image-fit {
		aspect-ratio: 230 / 328;
	}

	.mtt-posts-horizontal-slider-toggle .post-card--overlay .post-card__title {
		font-size: 25px;
		line-height: 25px;
	}
}
