/* =========================================================
   FIX SUMMARY TOP GAP

   Blocksy can make .entry-summary-items a flex/grid content box whose
   contents are vertically distributed inside the column. Resetting only
   margin/padding is not enough. Keep the summary in its natural height and
   pin its content to the physical top without touching position/top, so the
   existing sticky controller remains the source of truth.
   ========================================================= */

@media (min-width: 768px) {

	body.single-product
	.product-entry-wrapper.is-width-constrained
	> .summary.entry-summary.entry-summary-items {

		margin: 0 !important;
		margin-block: 0 !important;

		padding: 0 !important;
		padding-block: 0 !important;

		min-height: 0 !important;
		height: max-content !important;
		max-height: none !important;

		align-self: start !important;
		align-content: start !important;
		justify-content: flex-start !important;
		align-items: stretch !important;

		transform: none !important;
		translate: none !important;
	}

	/* The first custom block must begin at y=0 of the summary column. */
	body.single-product
	.product-entry-wrapper.is-width-constrained
	> .summary.entry-summary.entry-summary-items
	> .plsn-product-brand-card:first-child {

		margin-top: 0 !important;
		margin-block-start: 0 !important;
	}
}


/* =========================================================
   INFO BOX
   ========================================================= */

.plsn-product-brand-card {

	display:
		grid !important;

	grid-template-columns:
		64px minmax(0,1fr) !important;

	align-items:
		center !important;

	gap:
		16px !important;

	width:
		100% !important;

	max-width:
		100% !important;

	margin:
		0 0 14px !important;

	padding:
		8px !important;

	box-sizing:
		border-box !important;

	direction:
		rtl !important;

	text-align:
		right !important;

	background:
		#fff !important;

	border:
		1px solid
		var(
			--pl-border,
			#E3E8ED
		) !important;

	border-radius:
		6px !important;

	box-shadow:
		none !important;
}


.plsn-product-brand-card--no-image {

	grid-template-columns:
		minmax(0,1fr) !important;
}


.plsn-product-brand-card__media {

	width:
		64px !important;

	height:
		64px !important;

	min-width:
		64px !important;

	overflow:
		hidden !important;

	border-radius:
		6px !important;

	background:
		#F8FAFB !important;
}


.plsn-product-brand-card__image {

	display:
		block !important;

	width:
		100% !important;

	height:
		100% !important;

	margin:
		0 !important;

	object-fit:
		cover !important;

	object-position:
		center !important;
}


.plsn-product-brand-card__content {

	min-width:
		0 !important;
}


.plsn-product-brand-card__title {

	display:
		block !important;

	margin:
		0 !important;

	color:
		var(
			--pl-success,
			#16A34A
		) !important;

	font-size:
		15px !important;

	font-weight:
		600 !important;

	line-height:
		1.5 !important;
}


.plsn-product-brand-card__description {

	margin:
		2px 0 0 !important;

	padding:
		0 !important;

	color:
		var(
			--pl-text,
			#1F2933
		) !important;

	font-size:
		14px !important;

	font-weight:
		400 !important;

	line-height:
		1.6 !important;

	overflow-wrap:
		anywhere !important;
}


.plsn-product-brand-card__description p {

	margin:
		0 !important;

	padding:
		0 !important;
}


.plsn-product-brand-card__description p + p {

	margin-top:
		3px !important;
}


/* Same link feeling as reference */
.plsn-product-brand-card__description a {

	color:
		var(
			--pl-primary,
			#0F9F98
		) !important;

	text-decoration:
		underline !important;

	text-decoration-thickness:
		1px !important;

	text-underline-offset:
		2px !important;

	font-weight:
		inherit !important;

	transition:
		color .15s ease !important;
}


.plsn-product-brand-card__description a:hover {

	color:
		var(
			--pl-primary-hover,
			#0B7F79
		) !important;
}


.plsn-product-brand-card__description a:focus-visible {

	outline:
		2px solid
		var(
			--pl-primary,
			#0F9F98
		) !important;

	outline-offset:
		3px !important;

	border-radius:
		2px !important;
}


/* =========================================================
   PRODUCT SUBTITLE
   ========================================================= */

.plsn-product-subtitle {

	width:
		100% !important;

	margin:
		0 0 2px !important;

	padding:
		0 !important;

	color:
		#98A2B3 !important;

	font-size:
		14px !important;

	font-weight:
		400 !important;

	line-height:
		1.5 !important;

	text-align:
		right !important;
}


/* =========================================================
   PRODUCT TITLE

   Match the visible product price exactly. The typography snippet already
   exposes --pl-product-price, so the title follows the same size instead of
   maintaining a second independent value. The selector is intentionally more
   specific than the older typography override to avoid cascade conflicts.
   ========================================================= */

body.single-product
.product-entry-wrapper.is-width-constrained
> .summary.entry-summary
.product_title.entry-title {

	font-family:
		var(
			--pl-font,
			"Cairo",
			Tahoma,
			Arial,
			sans-serif
		) !important;

	font-size:
		var(--pl-product-price, 20px) !important;

	font-weight:
		700 !important;

	line-height:
		1.4 !important;

	letter-spacing:
		0 !important;
}


/* =========================================================
   PRODUCT CARD TITLE/SUBTITLE
   ========================================================= */

[data-products="type-2"]
> .product
.woocommerce-loop-product__title,

.woocommerce
ul.products[data-products="type-2"]
> li.product:not(.product-category)
.woocommerce-loop-product__title {

	font-size:
		16px !important;

	font-weight:
		600 !important;

	line-height:
		1.5 !important;
}


.plsn-card-subtitle {

	width:
		100% !important;

	margin:
		0 !important;

	padding:
		0 12px 6px !important;

	box-sizing:
		border-box !important;

	color:
		#98A2B3 !important;

	font-size:
		12px !important;

	font-weight:
		400 !important;

	line-height:
		1.5 !important;

	text-align:
		center !important;

	overflow-wrap:
		anywhere !important;
}


@media (max-width: 699px) {

	[data-products="type-2"]
	> .product
	.woocommerce-loop-product__title,

	.woocommerce
	ul.products[data-products="type-2"]
	> li.product:not(.product-category)
	.woocommerce-loop-product__title {

		font-size:
			14px !important;
	}


	.plsn-card-subtitle {

		padding-inline:
			8px !important;

		font-size:
			11.5px !important;
	}
}


@media (max-width: 360px) {

	.plsn-product-brand-card {

		grid-template-columns:
			52px minmax(0,1fr) !important;

		gap:
			10px !important;

		padding:
			7px !important;

		margin-bottom:
			12px !important;
	}


	.plsn-product-brand-card--no-image {

		grid-template-columns:
			minmax(0,1fr) !important;
	}


	.plsn-product-brand-card__media {

		width:
			52px !important;

		height:
			52px !important;

		min-width:
			52px !important;
	}


	.plsn-product-brand-card__title {

		font-size:
			14px !important;
	}


	.plsn-product-brand-card__description {

		font-size:
			12.5px !important;
	}
}