.entry-content {
	& .block-testimonials {
		margin: 88px auto;
	}
}

.block-testimonials {

	& .wp-heading {
		margin: 0 auto;
		max-width: 553px;
		text-align: center;
		width: 100%;
	}

	& .testimonial-slider,
	& .testimonial {
		& .slide-item {
			display: grid;
			grid-template-columns: 1fr;
			column-gap: 56px;
			
			width: 75%;

			/* max-width: 500px;
			width: 100%; */

			@media ( min-width: 840px ) {
				grid-template-columns: 1fr 1fr;
			}
		}
	}

	& .testimonial-slider {
		& .slide-item {
			margin: 6rem 5rem 6rem auto;
		}
	}

	& .testimonial {
		& .slide-item {
			margin: 8rem auto;
		}
	}

	& .flickity-prev-next-button {
		display: none;

		@media ( min-width: 840px ) {
			display: block;
		}
	}
}



.testimonial-slider {
	/* margin-bottom: 144px; */

	& .flickity-viewport {
		mask-image: linear-gradient(
			to right,
			hsl(0 0% 0% / 0),
			hsl(0 0% 0% / 1) 10%,
			hsl(0 0% 0% / 1) 90%,
			hsl(0 0% 0% / 0)
		);
	}

	& .flickity-slider {
		display: flex;
		align-items: center;
	}

	& .slide-item {
		opacity: 0.5;
	
		&.is-selected {
			opacity: 1;
		}
	}

  &.is-admin {
		&:before {
			display: block;
			content: "";
			top: 0;
			left: 0;
			right: 0;
			bottom: 40px;
			position: absolute;
			z-index: 1;
		}
	}
}



.slide-television {
	align-items: center;
	display: flex;
	justify-content: flex-end;
	margin-bottom: 1rem;
	

	@media ( width >= 840px ) {
		margin-bottom: 0;
	}
	

	& .television {
		background-size: 65%;
		background-repeat: no-repeat;
		background-position: 25% 30%;
		max-width: 500px;
		width: 100%;

		& svg {
			display: block;
		}
	}
}

.slide-content {
	background-color: var(--wp--preset--color--bg-off-white);
	border-radius: var(--wp--custom--border-radius--medium);
	display: flex;
	flex-direction: column;
	max-width: 500px;
	padding: 40px;

	& .quote {
		flex-grow: 1;
		font-size: var(--wp--preset--font-size--md);
		font-weight: 600;
		line-height: 1.2;
		margin-top: 0;
	}

	& .client {
		color: var(--wp--preset--color--bodytext);
		font-size: var(--wp--preset--font-size--sm);
		font-weight: 500;
	}
}

.rating-icon {
	fill: #6c6962;
  
	height: 24px;
	width: 24px;

	&.active {
		fill: var(--wp--preset--color--orange);
	}
}


#testimonial-modal {
  border: 0;
  border-radius: var(--wp--custom--border-radius--medium);
  padding: 2rem;
  position: fixed;
  width: var(--wp--custom--layout--narrow);

  &::backdrop {
    background-color: rgba(35, 61, 87, 0.35);
  }

  &:focus {
    outline: 0;
  }

  & .close {
    cursor: pointer;
    height: 24px;
    width: 24px;
    left: 0.5rem;
    position: absolute;
    top: 0.5rem;
  }
}
