/* Image Text Widget Styles
 *
 * Widget with 500x500px square image, tagline, headline, text, and buttons.
 */

/* ========================================
	LAYOUT
	======================================== */

/* Widget Container */
.image-text-widget {
	display: flex;
	align-items: center;
	gap: 60px;
	width: 100%;
}

/* Left Position - Image on Left */
.image-text-widget--left {
	flex-direction: row;
}

/* Right Position - Image on Right */
.image-text-widget--right {
	flex-direction: row-reverse;
}



.image-text-widget__image-wrapper {
	width: 34%;
}

/* Image Container - Square (fills wrapper) */
.image-text-widget__image {
	width: 100%;
	height: 100%;
}

.image-text-widget__image img,
.image-text-widget__image video,
.image-text-widget__media {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 10px;
}

/* Image Caption (Subtitle + Copyright) */
.image-text-widget__image-caption {
	margin-top: 12px;
}

.image-text-widget__image-subtitle {
	font-size: var(--paragraph-xs-font-size);
	line-height: var(--paragraph-xs-line-height);
	font-family: var(--paragraph-xs-font-family);
	font-weight: var(--paragraph-xs-font-weight);
	letter-spacing: var(--paragraph-xs-letter-spacing);
	word-spacing: var(--paragraph-xs-word-spacing);
}

.image-text-widget__image-copyright {
	font-size: var(--paragraph-xs-font-size);
	line-height: var(--paragraph-xs-line-height);
	font-family: var(--paragraph-xs-font-family);
	font-weight: var(--paragraph-xs-font-weight);
	letter-spacing: var(--paragraph-xs-letter-spacing);
	word-spacing: var(--paragraph-xs-word-spacing);
	opacity: 0.7;
}

/* Content Wrapper */
.image-text-widget__content {
	flex: 1;
	display: flex;
	flex-direction: column;
	row-gap: 30px;
	min-width: 0; /* Prevents flex item from overflowing */
}

/* ========================================
	TYPOGRAPHY
	======================================== */

/* Tagline - Uses label typography */
.image-text-widget__tagline {
	font-size: var(--label-font-size);
	line-height: var(--label-line-height);
	font-family: var(--label-font-family);
	font-weight: var(--label-font-weight);
	text-transform: var(--label-text-transform);
	letter-spacing: var(--label-letter-spacing);
	word-spacing: var(--label-word-spacing);
}

/* Headline - Uses h2 typography */
.image-text-widget__headline {
	font-size: var(--h2-font-size);
	line-height: var(--h2-line-height);
	font-weight: var(--h2-font-weight);
	letter-spacing: var(--h2-letter-spacing);
	word-spacing: var(--h2-word-spacing);
	margin: 0 0 0 0 !important;
}

/* Text - Uses paragraph typography */
.image-text-widget__text {
	font-size: var(--paragraph-font-size);
	line-height: var(--paragraph-line-height);
	font-family: var(--paragraph-font-family);
	font-weight: var(--paragraph-font-weight);
	letter-spacing: var(--paragraph-letter-spacing);
	word-spacing: var(--paragraph-word-spacing);
}

.image-text-widget__text p:last-child {
	margin-bottom: 0;
}

/* Buttons Container */
.image-text-widget__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	margin-top: 10px;
}

/* Button Icons */
.custom-btn__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* ========================================
	RESPONSIVE STYLES - Tablet
	======================================== */

@media screen and (max-width: 1024px) {
	.image-text-widget {
		gap: 40px;
	}


}

/* ========================================
	RESPONSIVE STYLES - Mobile
	======================================== */

@media screen and (max-width: 767px) {
	.image-text-widget {
		flex-direction: column !important;
		gap: 30px;
	}



	.image-text-widget__image-wrapper {
		width: 100%;
		margin: 0 auto;
	}

	.image-text-widget__content {
		width: 100%;
	}



}