/* Zachęta do opinii na półce (Etap 3) — tokeny motywu, wygląd akcji kafla
   wspólny z „Oznacz jako przeczytane" (btk-reading). */

/* ---------- „Oceń tytuł" na kaflu biblioteki ---------- */
.btk-rev-cta {
	display: inline-flex; align-items: center; gap: 6px;
	border: 1.5px solid var(--wp--preset--color--line); background: var(--wp--preset--color--card);
	color: var(--wp--preset--color--muted); border-radius: var(--btk-r-btn-sm, 10px);
	padding: 7px 13px; font-size: 12.5px; font-weight: 700; text-decoration: none;
}
.btk-rev-cta:hover { border-color: var(--wp--preset--color--amber); color: var(--wp--preset--color--ink); }
.btk-rev-cta svg { color: var(--wp--preset--color--amber); flex: none; }
/* punkty PUNKTOMANII za opinię — informacja, nie główny bodziec, więc mniejsza
   i w tincie programu, nie w kolorze akcji */
.btk-rev-cta__pkt {
	margin-left: auto; padding: 2px 7px; border-radius: 99px; font-size: 11px; font-weight: 800;
	background: var(--wp--preset--color--accent-soft); color: var(--wp--preset--color--accent-ink);
}

/* ---------- półka gościa: droga przez konto ---------- */
.btk-rev-guest {
	border: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--paper);
	border-radius: var(--btk-r-lg, 14px); padding: 18px 22px; margin: 22px 0 0; max-width: 720px;
}
.btk-rev-guest__h { margin: 0 0 6px; font-size: 15px; font-weight: 800; color: var(--wp--preset--color--ink); }
.btk-rev-guest p { margin: 0 0 8px; font-size: 13px; line-height: 1.6; color: var(--wp--preset--color--muted); }
.btk-rev-guest__act { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin: 14px 0 0; }
/* Motyw stylizuje `.button` tylko w swoich kontenerach (np. `.btk-empty .button`),
   a półka gościa do żadnego z nich nie należy — bez tej reguły „Załóż konto"
   wygląda jak zwykły tekst obok linku. Te same wartości co przycisk EmptyState. */
.btk-rev-guest .button {
	display: inline-flex; align-items: center; gap: 8px; background: var(--wp--preset--color--accent);
	color: #fff; border: 0; border-radius: var(--btk-r-btn, 12px); padding: 12px 26px; font-weight: 700;
	font-size: 14.5px; text-decoration: none; box-shadow: var(--btk-glow); cursor: pointer;
}
.btk-rev-guest .button:hover { background: var(--wp--preset--color--accent-ink); color: #fff; }
.btk-rev-guest__more { font-size: 12.5px; color: var(--wp--preset--color--muted); text-decoration: underline; text-underline-offset: 2px; }
.btk-rev-guest__more:hover { color: var(--wp--preset--color--accent); }

/* ---------- pasek po pobraniu pliku ---------- */
.btk-rev-bar {
	position: fixed; left: 50%; bottom: 22px; transform: translate(-50%, 12px);
	z-index: 9999; display: flex; align-items: center; gap: 14px;
	max-width: min(560px, calc(100vw - 32px));
	border: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--card);
	border-radius: var(--btk-r-lg, 14px); padding: 13px 16px;
	box-shadow: 0 12px 32px rgb(32 36 45 / 14%);
	opacity: 0; transition: opacity .22s ease, transform .22s ease;
}
.btk-rev-bar.is-on { opacity: 1; transform: translate(-50%, 0); }
.btk-rev-bar__t { margin: 0; font-size: 13px; line-height: 1.5; color: var(--wp--preset--color--ink); }
.btk-rev-bar__t a { color: var(--wp--preset--color--accent-ink); font-weight: 700; }
.btk-rev-bar__x {
	flex: none; border: 0; background: none; cursor: pointer; padding: 4px;
	font-size: 17px; line-height: 1; color: var(--wp--preset--color--muted);
}
.btk-rev-bar__x:hover { color: var(--wp--preset--color--ink); }

@media (prefers-reduced-motion: reduce) {
	.btk-rev-bar { transition: none; }
}

@media (max-width: 560px) {
	.btk-rev-bar { left: 16px; right: 16px; bottom: 16px; transform: none; max-width: none; }
	.btk-rev-bar.is-on { transform: none; }
}