/* Biblioteka spokoju — styl elementów dodawanych przez wtyczkę.
   Kolory sterowane zmiennymi: zmień je raz w Elementorze i wszystko pójdzie za nimi. */

:root {
	--ns-accent: #c98a63;
	--ns-accent-dark: #b2704b;
	--ns-accent-soft: #f6e3da;
	--ns-ink: #2c2a28;
	--ns-ink-soft: #6f6a66;
	--ns-line: #e6e1dc;
}

/* --- serduszko i checkbox na kafelku --- */
.ns-akcje { display: inline-flex; gap: 11px; align-items: center; }
.ns-akcja {
	background: none; border: 0; padding: 0; cursor: pointer; line-height: 0;
	color: #fff; filter: drop-shadow(0 1px 4px rgba(0, 0, 0, .35));
	transition: transform .15s ease;
}
.ns-akcja:hover { transform: scale(1.12); }
.ns-akcja svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.ns-akcja .ns-check { opacity: 0; transition: opacity .15s ease; }
.ns-akcja.is-on .ns-check { opacity: 1; }
.ns-ulubione.is-on svg { fill: currentColor; }
.ns-akcja[data-busy="1"] { opacity: .6; }

/* --- przełącznik „Ulubione" nad filtrami --- */
.ns-fav-toggle {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	background: var(--ns-accent-soft); color: var(--ns-accent-dark);
	border-radius: 14px; padding: 16px; font-weight: 500; text-decoration: none;
	transition: background .2s, color .2s;
}
.ns-fav-toggle:hover { background: #f0d5c8; color: var(--ns-accent-dark); }
.ns-fav-toggle.is-on { background: var(--ns-accent-dark); color: #fff; }
.ns-fav-toggle svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.ns-fav-count {
	background: rgba(255, 255, 255, .55); color: inherit;
	border-radius: 20px; padding: 0 8px; font-size: 13px;
}
.ns-fav-toggle.is-on .ns-fav-count { background: rgba(255, 255, 255, .25); }

/* --- odtwarzacz --- */
.ns-player { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #ede7e1; }
.ns-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ns-audio { margin: 20px 0; }

/* --- przyciski i komunikaty --- */
.ns-pdf-btn {
	display: inline-block; background: var(--ns-accent-dark); color: #fff;
	padding: 13px 26px; border-radius: 30px; text-decoration: none; font-weight: 500;
	transition: background .2s;
}
.ns-pdf-btn:hover { background: #995e3d; color: #fff; }
.ns-link { color: var(--ns-accent-dark); }

.ns-paywall, .ns-status {
	border: 1px solid var(--ns-line); border-radius: 14px;
	padding: 22px 24px; background: #fffdfc;
}
.ns-status--on { border-color: #dfe9df; background: #f7fbf7; }
.ns-status--off { border-color: #f0dcd6; background: #fdf7f5; }
.ns-status p, .ns-paywall p { margin: 0 0 10px; }
.ns-status p:last-child, .ns-paywall p:last-child { margin-bottom: 0; }
.ns-info { color: var(--ns-ink-soft); font-size: 14px; }

/* --- liczniki w Moim koncie --- */
.ns-liczniki { list-style: none; display: flex; gap: 34px; margin: 24px 0; padding: 0; }
.ns-liczniki strong { display: block; font-size: 30px; line-height: 1.1; color: var(--ns-accent-dark); }
.ns-liczniki li { color: var(--ns-ink-soft); font-size: 14px; }

/* --- plany na stronie sprzedaży --- */
.ns-plany { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ns-plan {
	border: 1px solid var(--ns-line); border-radius: 16px; padding: 28px 26px;
	background: #fffdfc; display: flex; flex-direction: column; text-align: center;
}
.ns-plan h3 { margin: 0 0 10px; font-size: 22px; }
.ns-plan-cena { font-size: 26px; font-weight: 600; color: var(--ns-ink); margin: 0 0 4px; }
.ns-plan-cena del { font-size: 17px; font-weight: 400; color: var(--ns-ink-soft); }
.ns-plan-czas { color: var(--ns-accent); font-size: 14px; margin: 0 0 16px; }
.ns-plan-opis { color: var(--ns-ink-soft); font-size: 14.5px; margin-bottom: 22px; }
.ns-plan .ns-pdf-btn { margin-top: auto; }
@media (max-width: 860px) { .ns-plany { grid-template-columns: 1fr; } }

/* --- komunikat o nieudanym zapisie --- */
.ns-toast {
	position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 20px);
	background: var(--ns-ink); color: #fff; padding: 13px 22px; border-radius: 30px;
	font-size: 14px; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s;
	z-index: 9999;
}
.ns-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
