/**
 * LA Course Commerce — minimal frontend styling.
 *
 * Deliberately does NOT set colors, fonts or layouts: the site (Astra +
 * Elementor) provides all visual styling.
 */

.la-buy-now-wrap {
	margin-top: 0;
}

/**
 * Match the theme's Elementor button look (Astra's
 * `.elementor-widget-button .elementor-button` rules) so buy buttons are
 * styled identically to every other button on the site.
 */
.elementor-widget-la_course_buy_button .la-buy-now,
.elementor-widget-la_course_buy_button .la-buy-now:visited {
	border-color: var( --ast-global-color-1 );
	background-color: var( --ast-global-color-1 );
	color: var( --ast-global-color-4 );
	text-decoration: none;
}

.elementor-widget-la_course_buy_button .la-buy-now:hover,
.elementor-widget-la_course_buy_button .la-buy-now:focus {
	color: var( --ast-global-color-4 );
	background-color: var( --ast-global-color-0 );
	border-color: var( --ast-global-color-0 );
	text-decoration: none;
}

/**
 * Match the theme's Elementor heading look. The `elementor-heading-title`
 * class rendered by the widget picks up Elementor's global heading rules
 * (line-height, margins, size classes); only the linked state needs a scoped
 * rule, mirroring Elementor's
 * `.elementor-heading-title[class*=elementor-size-]>a` rule which requires a
 * `.elementor-widget-heading` ancestor.
 */
.elementor-widget-la_course_title .la-course-title a,
.elementor-widget-la_course_title .la-course-title a:hover,
.elementor-widget-la_course_title .la-course-title a:focus,
.elementor-widget-la_course_title .la-course-title a:visited {
	color: inherit;
	font-size: inherit;
	line-height: inherit;
	text-decoration: none;
}

/**
 * Course "Read More" link. Inherits the theme's link styling; only the
 * underline-off state is forced, matching the other card links.
 */
.elementor-widget-la_course_read_more .la-course-read-more,
.elementor-widget-la_course_read_more .la-course-read-more:hover,
.elementor-widget-la_course_read_more .la-course-read-more:focus,
.elementor-widget-la_course_read_more .la-course-read-more:visited {
	text-decoration: none;
}

/**
 * Course card template (Elementor template 418).
 *
 * Every styling rule for the course card loop lives here, in the plugin, so
 * the card never depends on Elementor's generated per-template CSS. The
 * template itself is kept free of styling settings.
 */

/* Card image radius. */
.elementor-widget-image img {
	border-radius: 10px;
}

/* Card content alignment (left is also the browser default). */
.elementor-widget-la_course_title .la-course-title,
.elementor-widget-la_course_read_more .la-course-read-more-wrap,
.elementor-widget-la_course_buy_button .la-buy-now-wrap {
	text-align: left;
}

/**
 * Card title + excerpt line limits: clamp to a fixed number of lines so every
 * card stays the same height; text past the limit is truncated with "…".
 * The title stays on a single line; the excerpt gets up to three.
 */
.elementor-widget-la_course_title .la-course-title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
}

.elementor-widget-la_course_excerpt .la-course-excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/**
 * Read More + Book Now footer row: both on one line, aligned to the end of
 * the card. Also neutralizes Elementor's per-widget block-end margin and the
 * buy-wrap top margin so both stay vertically centered.
 */
.la-action-container {
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	gap: 12px;
	flex-wrap: nowrap;
}

.elementor-widget {
	margin-block-end: 0;
}

.la-buy-now-wrap {
	margin-top: 0;
}