/* La Plata Audiokniha – vzhľad preberá písmo témy, farbu akcentu zmeníte cez --lppa-accent */
.lppa-box {
	--lppa-accent: #1f3a5f;
	--lppa-line: rgba(127, 127, 127, .28);
	--lppa-soft: rgba(127, 127, 127, .08);
	box-sizing: border-box;
	max-width: 640px;
	margin: 1.5em auto;
	padding: 1.5em;
	border: 1px solid var(--lppa-line);
	border-radius: 12px;
	line-height: 1.5;
}
.lppa-box *, .lppa-box *::before, .lppa-box *::after { box-sizing: border-box; }
.lppa-box h3 { margin: 0 0 .25em; }
.lppa-box--ok { border-color: #2e7d4f; }
.lppa-box--warn { border-color: #b26a00; }

.lppa-btn {
	display: inline-block;
	padding: .75em 1.4em;
	border: 0;
	border-radius: 8px;
	background: var(--lppa-accent);
	color: #fff !important;
	font: inherit;
	font-weight: 600;
	text-decoration: none !important;
	cursor: pointer;
}
.lppa-btn:hover, .lppa-btn:focus-visible { filter: brightness(1.15); }
.lppa-btn--ghost { background: transparent; color: var(--lppa-accent) !important; border: 1px solid var(--lppa-accent); }
.lppa-small { font-size: .85em; opacity: .75; margin: .5em 0 0; }

/* Objednávka */
.lppa-buy__head { margin-bottom: 1em; }
.lppa-buy__author, .lppa-buy__meta { margin: 0; opacity: .8; }
.lppa-buy__price { font-size: 1.6em; font-weight: 700; margin: .3em 0 0; }
.lppa-field { margin: 0 0 1em; }
.lppa-field label { display: block; font-weight: 600; margin-bottom: .3em; }
.lppa-field input { width: 100%; padding: .65em .8em; border: 1px solid var(--lppa-line); border-radius: 8px; font: inherit; }
.lppa-field small { display: block; opacity: .7; margin-top: .3em; }
.lppa-check { margin: 0 0 .8em; font-size: .92em; }
.lppa-check label { display: flex; gap: .6em; align-items: flex-start; }
.lppa-check input { margin-top: .3em; flex: none; }
.lppa-msg { padding: .7em 1em; border-radius: 8px; background: var(--lppa-soft); }
.lppa-msg--error { background: rgba(200, 40, 40, .1); color: #a11; }
.lppa-hp { position: absolute !important; left: -9999px !important; height: 1px; overflow: hidden; }

/* Prehrávač */
.lppa-player__author { margin: 0; opacity: .8; }
.lppa-now { margin: 1em 0 .5em; }
.lppa-now__label { display: block; font-size: .8em; text-transform: uppercase; letter-spacing: .06em; opacity: .65; }
.lppa-now__title { font-size: 1.15em; }
.lppa-audio { width: 100%; margin: .4em 0; }
.lppa-controls { display: flex; flex-wrap: wrap; gap: .5em; align-items: center; margin: .3em 0 .8em; }
.lppa-ctl {
	min-width: 3em;
	padding: .5em .8em;
	border: 1px solid var(--lppa-line);
	border-radius: 8px;
	background: transparent;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
.lppa-ctl:hover { background: var(--lppa-soft); }
.lppa-speed { margin-left: auto; font-size: .9em; display: flex; gap: .4em; align-items: center; }
.lppa-rate { padding: .35em; border-radius: 6px; font: inherit; }
.lppa-resume { margin: 0 0 1em; }
.lppa-resume .lppa-btn { width: 100%; text-align: left; }
.lppa-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--lppa-line); }
.lppa-list li { margin: 0; padding: 0; border-bottom: 1px solid var(--lppa-line); }
.lppa-ch {
	display: flex;
	gap: .9em;
	width: 100%;
	padding: .7em .4em;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
}
.lppa-ch:hover { background: var(--lppa-soft); }
.lppa-ch__n { flex: none; width: 1.8em; text-align: right; opacity: .55; font-variant-numeric: tabular-nums; }
.lppa-ch.is-active { font-weight: 700; color: var(--lppa-accent); }
.lppa-ch.is-active .lppa-ch__n { opacity: 1; }

@media (max-width: 480px) {
	.lppa-box { padding: 1.1em; border-radius: 10px; }
	.lppa-speed { margin-left: 0; width: 100%; }
}

/* Knižnica */
.lppa-library { max-width: 960px; margin: 1.5em auto; }
.lppa-library--more { margin-top: 2.5em; }
.lppa-library__title { margin: 0; }
.lppa-library__sub { margin: 0 0 .8em; }
.lppa-library__head { margin-bottom: 1.2em; }
.lppa-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: 1.4em 1.2em;
}
.lppa-card { margin: 0; padding: 0; }
.lppa-card a { display: flex; flex-direction: column; gap: .2em; color: inherit; text-decoration: none; }
.lppa-card__cover {
	display: block;
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	overflow: hidden;
	background: rgba(127, 127, 127, .12);
	margin-bottom: .5em;
	transition: transform .15s ease, box-shadow .15s ease;
}
.lppa-card__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lppa-card__ph { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; font-size: 3em; opacity: .35; }
.lppa-card a:hover .lppa-card__cover, .lppa-card a:focus-visible .lppa-card__cover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0, 0, 0, .15); }
.lppa-card__title { font-weight: 700; line-height: 1.3; }
.lppa-card__author, .lppa-card__meta { font-size: .88em; opacity: .7; }
.lppa-card--more .lppa-card__cover { opacity: .85; }

.lppa-back { max-width: 640px; margin: 1.5em auto -.8em; }
.lppa-back a { text-decoration: none; }
.lppa-player__head { display: flex; gap: 1em; align-items: center; }
.lppa-player__cover { width: 84px; height: 84px; object-fit: cover; border-radius: 8px; flex: none; }
.lppa-actions { display: flex; flex-wrap: wrap; gap: .6em; }
.lppa-msg--ok { background: rgba(46, 125, 79, .12); }
@media (max-width: 480px) {
	.lppa-grid { grid-template-columns: repeat(2, 1fr); gap: 1.1em .9em; }
	.lppa-player__cover { width: 64px; height: 64px; }
}

/* Predpredaj */
.lppa-badge {
	display: inline-block;
	padding: .1em .55em;
	margin-right: .3em;
	border-radius: 999px;
	background: #f3e3b5;
	color: #5c4400;
	font-size: .78em;
	font-weight: 700;
	letter-spacing: .02em;
	vertical-align: .1em;
}

/* Predajná stránka s obálkou */
.lppa-buy--cover { max-width: 780px; }
.lppa-buy__top { display: block; }
.lppa-buy--cover .lppa-buy__top {
	display: grid;
	grid-template-columns: minmax(0, 240px) minmax(0, 1fr);
	gap: 1.5em;
	align-items: start;
	margin-bottom: 1.2em;
}
.lppa-buy__cover img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
}
.lppa-buy--cover .lppa-buy__head { margin-bottom: 0; }
.lppa-buy__desc { margin-top: .8em; }
.lppa-buy__desc p { margin: 0 0 .6em; }

/* Ukážky */
.lppa-samples { margin: 0 0 1.4em; padding: 1em 1.1em; border-radius: 10px; background: var(--lppa-soft, rgba(127, 127, 127, .08)); }
.lppa-samples-box .lppa-samples { margin: 0; padding: 0; background: none; }
.lppa-samples__title { margin: 0 0 .5em; font-weight: 700; }
.lppa-samples__list { list-style: none; margin: 0; padding: 0; }
.lppa-sample { display: flex; align-items: center; gap: .8em; margin: 0; padding: .45em 0; }
.lppa-sample + .lppa-sample { border-top: 1px solid var(--lppa-line, rgba(127, 127, 127, .28)); }
.lppa-sample__btn {
	flex: none;
	width: 2.4em;
	height: 2.4em;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--lppa-accent, #1f3a5f);
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.lppa-sample__btn:hover, .lppa-sample__btn:focus-visible { filter: brightness(1.15); }
.lppa-sample__icon {
	display: block;
	width: 0;
	height: 0;
	margin-left: .15em;
	border-style: solid;
	border-width: .42em 0 .42em .7em;
	border-color: transparent transparent transparent currentColor;
}
.lppa-sample.is-playing .lppa-sample__icon {
	width: .62em;
	height: .75em;
	margin-left: 0;
	border: 0;
	border-left: .2em solid currentColor;
	border-right: .2em solid currentColor;
	box-sizing: border-box;
}
.lppa-sample.is-loading .lppa-sample__btn { opacity: .7; }
.lppa-sample__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .35em; }
.lppa-sample__name { line-height: 1.3; }
.lppa-sample.is-playing .lppa-sample__name { font-weight: 700; }
.lppa-sample__bar { display: block; height: 4px; border-radius: 2px; background: var(--lppa-line, rgba(127, 127, 127, .28)); cursor: pointer; overflow: hidden; }
.lppa-sample__fill { display: block; height: 100%; width: 0; background: var(--lppa-accent, #1f3a5f); }
.lppa-sample__time { flex: none; font-size: .85em; opacity: .7; font-variant-numeric: tabular-nums; min-width: 5.8em; text-align: right; white-space: nowrap; }

@media (max-width: 560px) {
	.lppa-buy--cover .lppa-buy__top { grid-template-columns: 1fr; gap: 1em; }
	.lppa-buy__cover { max-width: 260px; margin: 0 auto; }
}
