/*
 * LTS Lesson Download Placement
 * Presentation-only styles. All selectors are scoped to .lts-resource-card
 * so existing download, membership, and popup systems remain untouched.
 */

.lts-resource-card {
	--lts-navy: #1d3557;
	--lts-navy-deep: #132743;
	--lts-gold: #c79a2b;
	--lts-gold-deep: #9a6d13;
	--lts-cream: #fffaf0;
	--lts-text: #26374a;
	--lts-muted: #647184;
	--lts-border: rgba(199, 154, 43, 0.38);

	position: relative;
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr) minmax(190px, 220px);
	align-items: center;
	gap: 18px;
	width: 100%;
	box-sizing: border-box;
	margin: 24px 0 30px;
	padding: 17px 18px;
	border: 1px solid var(--lts-border);
	border-left: 4px solid var(--lts-gold);
	border-radius: 14px;
	background:
		linear-gradient(135deg, rgba(255, 250, 240, 0.98), rgba(255, 255, 255, 0.98));
	box-shadow: 0 10px 28px rgba(19, 39, 67, 0.09);
	color: var(--lts-text);
}

.lts-resource-card--member {
	border-left-color: var(--lts-navy);
	background:
		linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(248, 241, 228, 0.98));
}

.lts-resource-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 13px;
	background: linear-gradient(145deg, var(--lts-navy), #2e527f);
	color: #fff;
	box-shadow: 0 7px 16px rgba(29, 53, 87, 0.2);
}

.lts-resource-card--member .lts-resource-card__icon {
	background: linear-gradient(145deg, #d3a83d, var(--lts-gold-deep));
}

.lts-resource-card__icon svg {
	width: 27px;
	height: 27px;
	fill: currentColor;
}

.lts-resource-card__content {
	min-width: 0;
}

.lts-resource-card__title {
	margin: 0 0 5px !important;
	padding: 0;
	color: var(--lts-navy-deep);
	font-size: clamp(18px, 1.5vw, 22px);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.015em;
}

.lts-resource-card__description {
	margin: 0 !important;
	padding: 0;
	color: var(--lts-text);
	font-size: 15px;
	line-height: 1.55;
}

.lts-resource-card__actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.lts-resource-card__download,
.lts-resource-card__download p,
.lts-resource-card__download div {
	margin: 0 !important;
	padding: 0 !important;
}

.lts-resource-card__download br,
.lts-resource-card__counter br {
	display: none;
}

.lts-resource-card__download a,
.lts-resource-card__download button,
.lts-resource-card__download input[type="submit"],
.lts-resource-card__account-button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	min-height: 42px;
	box-sizing: border-box;
	margin: 0 !important;
	padding: 10px 15px !important;
	border-radius: 999px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	text-align: center;
	text-decoration: none !important;
	transition:
		transform 160ms ease,
		box-shadow 160ms ease,
		background-color 160ms ease,
		border-color 160ms ease;
}

.lts-resource-card__download a,
.lts-resource-card__download button,
.lts-resource-card__download input[type="submit"] {
	border: 1px solid var(--lts-navy) !important;
	background: linear-gradient(135deg, var(--lts-navy), #2d4f7c) !important;
	color: #fff !important;
	box-shadow: 0 6px 15px rgba(29, 53, 87, 0.2);
}

.lts-resource-card--member .lts-resource-card__download a,
.lts-resource-card--member .lts-resource-card__download button,
.lts-resource-card--member .lts-resource-card__download input[type="submit"] {
	border-color: var(--lts-gold-deep) !important;
	background: linear-gradient(135deg, #c99a2e, #a77716) !important;
	box-shadow: 0 6px 15px rgba(154, 109, 19, 0.2);
}

.lts-resource-card__account-button {
	border: 1px solid rgba(199, 154, 43, 0.75) !important;
	background: #fff !important;
	color: var(--lts-navy) !important;
}

.lts-resource-card__account-button {
	flex-direction: column;
	gap: 1px;
	min-height: 58px;
	line-height: 1.05 !important;
}

.lts-resource-card__account-primary,
.lts-resource-card__account-secondary {
	display: block;
}

.lts-resource-card__account-primary {
	font-size: 13px;
	font-weight: 800;
}

.lts-resource-card__account-or {
	display: block;
	color: var(--lts-gold-deep);
	font-size: 9px;
	font-weight: 900;
	letter-spacing: 0.18em;
	line-height: 1;
}

.lts-resource-card__account-secondary {
	font-size: 12px;
	font-weight: 900;
}

.lts-resource-card__download a:hover,
.lts-resource-card__download button:hover,
.lts-resource-card__download input[type="submit"]:hover,
.lts-resource-card__account-button:hover {
	transform: translateY(-1px);
	box-shadow: 0 9px 20px rgba(29, 53, 87, 0.2);
}

.lts-resource-card__account-button:hover {
	border-color: var(--lts-gold) !important;
	background: var(--lts-cream) !important;
	color: var(--lts-navy-deep) !important;
}

.lts-resource-card__download a:focus-visible,
.lts-resource-card__download button:focus-visible,
.lts-resource-card__download input[type="submit"]:focus-visible,
.lts-resource-card__account-button:focus-visible,
.lts-package-info__trigger:focus-visible {
	outline: 3px solid rgba(199, 154, 43, 0.42);
	outline-offset: 2px;
}

.lts-resource-card__counter,
.lts-resource-card__counter p,
.lts-resource-card__counter div,
.lts-resource-card__counter .lts-downloads-remaining {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: var(--lts-muted) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	text-align: center;
}

/*
 * Logged-out visitor allowance.
 * This is status information, not an action, so it sits beneath the card's
 * main content instead of appearing as a third button in the action stack.
 */
.lts-resource-card--guest .lts-resource-card__counter--guest {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	min-height: 28px;
	box-sizing: border-box;
	margin: 8px 0 0 !important;
	padding: 5px 9px !important;
	border: 1px solid rgba(29, 53, 87, 0.08) !important;
	border-radius: 7px;
	background: rgba(29, 53, 87, 0.035) !important;
	color: var(--lts-muted) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	text-align: left;
}

.lts-resource-card--guest .lts-resource-card__counter--guest::before {
	content: "i";
	display: inline-flex;
	flex: 0 0 16px;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--lts-navy);
	color: #fff;
	font-family: Georgia, serif;
	font-size: 11px;
	font-style: italic;
	font-weight: 700;
	line-height: 1;
}

.lts-resource-card--guest .lts-resource-card__counter--guest p,
.lts-resource-card--guest .lts-resource-card__counter--guest div,
.lts-resource-card--guest .lts-resource-card__counter--guest .lts-downloads-remaining {
	color: inherit !important;
	font: inherit !important;
	line-height: inherit !important;
	text-align: left !important;
}

/* Premium package hover/focus/tap popover */
.lts-package-info {
	position: relative;
	display: inline;
	white-space: normal;
}

.lts-package-info__trigger {
	display: inline;
	margin: 0;
	padding: 0;
	border: 0;
	border-bottom: 1px dotted var(--lts-gold-deep);
	background: transparent;
	color: var(--lts-gold-deep);
	font: inherit;
	font-weight: 800;
	line-height: inherit;
	cursor: help;
}

.lts-package-info__symbol {
	display: inline-block;
	margin-left: 2px;
	font-size: 0.88em;
}

.lts-package-info__popover {
	position: absolute;
	z-index: 9999;
	left: 50%;
	bottom: calc(100% + 12px);
	display: grid;
	gap: 5px;
	width: min(310px, calc(100vw - 36px));
	box-sizing: border-box;
	padding: 15px 16px;
	border: 1px solid rgba(199, 154, 43, 0.58);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 16px 38px rgba(19, 39, 67, 0.2);
	color: var(--lts-text);
	font-size: 13px;
	line-height: 1.4;
	text-align: left;
	white-space: normal;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 6px);
	pointer-events: none;
	transition:
		opacity 150ms ease,
		transform 150ms ease,
		visibility 150ms ease;
}

.lts-package-info__popover::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	width: 12px;
	height: 12px;
	border-right: 1px solid rgba(199, 154, 43, 0.58);
	border-bottom: 1px solid rgba(199, 154, 43, 0.58);
	background: #fff;
	transform: translate(-50%, -6px) rotate(45deg);
}

.lts-package-info__popover strong {
	display: block;
	margin-bottom: 3px;
	color: var(--lts-navy-deep);
	font-size: 14px;
}

.lts-package-info:hover .lts-package-info__popover,
.lts-package-info:focus-within .lts-package-info__popover,
.lts-package-info.is-open .lts-package-info__popover {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
	pointer-events: auto;
}

@media (max-width: 900px) {
	.lts-resource-card {
		grid-template-columns: 48px minmax(0, 1fr);
	}

	.lts-resource-card__actions {
		grid-column: 2;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: start;
	}

	.lts-resource-card--member .lts-resource-card__actions {
		grid-template-columns: minmax(0, 240px);
	}

	.lts-resource-card--member .lts-resource-card__counter {
		grid-column: 1 / -1;
	}

}

@media (max-width: 620px) {
	.lts-resource-card {
		grid-template-columns: 42px minmax(0, 1fr);
		gap: 12px;
		padding: 15px;
		margin: 20px 0 26px;
		border-radius: 12px;
	}

	.lts-resource-card__icon {
		width: 42px;
		height: 42px;
		border-radius: 11px;
	}

	.lts-resource-card__icon svg {
		width: 23px;
		height: 23px;
	}

	.lts-resource-card__title {
		font-size: 18px;
	}

	.lts-resource-card__description {
		font-size: 14px;
	}

	.lts-resource-card__actions {
		grid-column: 1 / -1;
		grid-template-columns: 1fr;
	}

	.lts-resource-card--member .lts-resource-card__actions {
		grid-template-columns: 1fr;
	}

	.lts-package-info__popover {
		position: fixed;
		left: 18px;
		right: 18px;
		bottom: auto;
		top: 50%;
		width: auto;
		max-width: none;
		transform: translateY(-50%);
	}

	.lts-package-info:hover .lts-package-info__popover,
	.lts-package-info:focus-within .lts-package-info__popover,
	.lts-package-info.is-open .lts-package-info__popover {
		transform: translateY(-50%);
	}

	.lts-package-info__popover::after {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lts-resource-card *,
	.lts-resource-card *::before,
	.lts-resource-card *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
	}
}
