/* Review widget ("Pomohlo vám to?") at the bottom of the free tools, and approved reviews on the website.
   Tokens from base.css. A quiet panel (no shadow — the one shadow belongs to the document sheet); the chosen rating
   takes the stamp ink, nothing moves. */

.rz { max-width: 760px; margin: var(--s-7) 0 var(--s-6); padding: var(--s-5); border: 1px solid var(--rule);
  border-left: 3px solid var(--stamp); border-radius: 0 var(--r-ctl) var(--r-ctl) 0; background: var(--sheet); }
.rz h2 { font-size: var(--f-21); line-height: 28px; margin: 0 0 var(--s-3); }
.rz em { font-style: normal; font-weight: 400; color: var(--ink-2); margin-left: 4px; }

.rz-rating { border: 0; margin: 0; padding: 0; min-width: 0; }
.rz-rating legend { padding: 0; margin-bottom: var(--s-2); font-size: var(--f-13); line-height: 18px; font-weight: 500; color: var(--ink-2); }
.rz-scale { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s-2); max-width: 460px; }
.rz-rate { position: relative; display: grid; justify-items: center; gap: 2px; min-height: 56px; padding: var(--s-2) var(--s-1);
  border: 1px solid var(--control, var(--rule)); border-radius: var(--r-ctl); background: var(--sheet); cursor: pointer; }
.rz-rate input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.rz-n { font-size: var(--f-21); line-height: 26px; font-weight: 650; font-variant-numeric: tabular-nums; }
.rz-w { font-size: 12px; line-height: 16px; color: var(--ink-2); }
.rz-rate:hover { border-color: var(--ink-2); }
.rz-rate:has(input:checked) { border-color: var(--stamp); background: var(--stamp-wash); color: var(--stamp); }
.rz-rate:has(input:checked) .rz-w { color: var(--stamp); }
.rz-rate:has(input:focus-visible) { box-shadow: var(--focus); }
.rz-bad .rz-rate { border-color: color-mix(in srgb, var(--bad) 55%, var(--rule)); }

.rz-text { margin-top: var(--s-4); max-width: 64ch; }
.rz-text textarea { width: 100%; }
.rz-more { margin-top: var(--s-4); }
.rz-more summary { cursor: pointer; color: var(--stamp); font-weight: 550; width: fit-content; }
.rz-more[open] summary { margin-bottom: var(--s-3); }
.rz-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.rz-grid input, .rz-email input { width: 100%; }
.rz-email { margin-top: var(--s-4); max-width: 360px; }
.rz-check { display: flex; align-items: flex-start; gap: var(--s-3); margin-top: var(--s-3); max-width: 64ch;
  font-size: var(--f-13); line-height: 20px; cursor: pointer; }
.rz-check input { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--stamp); }

.rz-send { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); margin-top: var(--s-5); }
.rz-live { margin: 0; font-size: var(--f-13); color: var(--ink-2); }
.rz-note { margin: var(--s-4) 0 0; font-size: var(--f-13); line-height: 20px; color: var(--ink-2); }
.rz-note a { color: var(--ink-2); }

/* honeypot: off-screen, out of the tab order and hidden from assistive tech */
.rz-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* thanks: shown after fetch (.rz-done) or, without JavaScript, when the redirect lands on #rz-dakujeme */
.rz-thanks { display: none; }
.rz-thanks p { margin: 0; color: var(--ink-2); }
.rz-thanks:focus { outline: none; }
.rz-done .rz-thanks, .rz-thanks:target { display: block; }
.rz-done .rz-form, .rz:has(.rz-thanks:target) .rz-form { display: none; }

/* retry page (post without JavaScript that did not pass the checks) */
.rz-page { max-width: 808px; padding-top: var(--s-6); padding-bottom: var(--s-7); }
.rz-page .rz { margin-top: var(--s-4); }
.rz-errors { padding: var(--s-4); border-radius: var(--r-ctl); background: var(--bad-wash); }
.rz-errors h1 { font-size: var(--f-21); line-height: 28px; color: var(--bad); }
.rz-errors ul { margin: var(--s-2) 0 0; padding-left: var(--s-5); }

/* approved reviews on the website */
.rz-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.rz-card { display: flex; flex-direction: column; gap: var(--s-3); margin: 0; padding: var(--s-4) 0 0; border-top: 2px solid var(--ink); }
.rz-card blockquote { margin: 0; }
.rz-card blockquote p { margin: 0; font-size: var(--f-17); line-height: 26px; max-width: 48ch; }
.rz-card figcaption { margin-top: auto; display: grid; gap: 2px; font-size: var(--f-13); line-height: 18px; }
.rz-card figcaption span, .rz-card figcaption small { color: var(--ink-2); }
.rz-dots { display: flex; gap: 4px; }
.rz-dots i { width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--stamp); }
.rz-dots i.on { background: var(--stamp); }

@media (max-width: 900px) { .rz-cards { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
  .rz { padding: var(--s-4); margin-top: var(--s-6); }
  .rz-grid { grid-template-columns: 1fr; }
  .rz-scale { gap: var(--s-1); }
  .rz-w { font-size: 11px; }
  .rz-send .btn { width: 100%; }
}

/* ── touch ─────────────────────────────────────────────────────────── */
@media (pointer: coarse) {
  .rz-check { min-height: 44px; align-items: center; font-size: var(--f-15); }
  .rz-check input { width: 22px; height: 22px; margin: 0; }
  .rz-more summary { padding-block: 10px; }
}