/**
 * Diamond Brothers – WooCommerce Description Read More
 *
 * Only the collapse mechanics live here. Typography, colours and the button
 * itself are inherited from the active theme / WooCommerce, on purpose.
 */

/*
 * NOTE: --dbwdr-collapsed and --dbwdr-fade are set by Elementor on the widget
 * wrapper (.elementor-element) from the widget controls. They must NOT be
 * declared here, or they would shadow the inherited values; fallbacks are
 * given inline in var() instead.
 */
.dbwdr {
	--dbwdr-fade-height: 3.5em;
	--dbwdr-duration: 0.35s;
	position: relative;
	max-width: 100%;
	box-sizing: border-box;
}

.dbwdr-content {
	position: relative;
	max-width: 100%;
	box-sizing: border-box;
	transition: max-height var(--dbwdr-duration) ease;
	will-change: max-height;
}

/* Collapsed state (applied by JS once the toggle is needed). */
.dbwdr-content.is-collapsed {
	max-height: var(--dbwdr-collapsed, 150px);
	overflow: hidden;
}

/* While animating, keep overflow hidden so the height change looks smooth. */
.dbwdr-content.is-animating {
	overflow: hidden;
}

/* Fade at the bottom of the clipped text. */
.dbwdr--fade .dbwdr-content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: var(--dbwdr-fade-height);
	background: linear-gradient(to bottom, transparent, var(--dbwdr-fade, #fff));
	pointer-events: none;
	opacity: 0;
	transition: opacity var(--dbwdr-duration) ease;
}

.dbwdr--fade .dbwdr-content.is-collapsed::after {
	opacity: 1;
}

/* Pre-JS state also gets the fade so the first paint looks finished. */
.dbwdr--fade:not(.dbwdr--ready) .dbwdr-content::after {
	opacity: 1;
}

/* Toggle row. */
.dbwdr-actions {
	margin-top: 0.75em;
}

/* Hidden when JS decides the whole description already fits, or the current
   device has Read More disabled. */
.dbwdr--no-toggle .dbwdr-actions {
	display: none;
}

.dbwdr-toggle {
	cursor: pointer;
}

/* Link style: inherit the theme's link colour and font, nothing else. */
.dbwdr-toggle--link {
	display: inline-block;
	font: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

/* Keep long descriptions fluid on narrow screens. */
.dbwdr-content img,
.dbwdr-content iframe,
.dbwdr-content video,
.dbwdr-content embed,
.dbwdr-content object {
	max-width: 100%;
	height: auto;
}

.dbwdr-content table {
	max-width: 100%;
	display: block;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.dbwdr-content pre {
	max-width: 100%;
	overflow-x: auto;
}

/* Trim stray margins at the edges of the clipped region so the collapsed
   height feels consistent between products. */
.dbwdr-content > :first-child {
	margin-top: 0;
}

.dbwdr-content > :last-child {
	margin-bottom: 0;
}

/* Editor-only notice. */
.dbwdr-notice {
	padding: 0.75em 1em;
	border-left: 4px solid #71d7f7;
	background: #f3f9fb;
	font-size: 0.9em;
}

@media (prefers-reduced-motion: reduce) {
	.dbwdr-content,
	.dbwdr--fade .dbwdr-content::after {
		transition: none;
	}
}
