/* «Повідомити про неточність» (report.js). Palette follows quiz.css; the theme paints every button:hover/:focus
   bright red (#ff2b2b), so every button here sets its own hover/focus colours. */

.zr-fab { position: fixed; right: 16px; bottom: 16px; z-index: 900; display: inline-flex; align-items: center; gap: .45em;
  margin: 0; padding: .55em .95em; border: 1px solid #b9cfe2; border-radius: 999px; background: #fff; color: #004d80;
  font-family: inherit; font-weight: 600; font-size: 14px; line-height: 1.2; letter-spacing: 0; text-transform: none; box-shadow: 0 2px 10px rgba(0, 40, 80, .15); cursor: pointer; opacity: .92; }
.zr-fab:hover, .zr-fab:focus { border-color: #0067ac; background: #eef5fb; color: #004d80; opacity: 1; outline: none; }
.zr-fab:focus-visible { outline: 2px solid #0067ac; outline-offset: 2px; }
.zr-fab[hidden] { display: none; }
.zr-fab__short { display: none; }
@media (max-width: 600px) {
  .zr-fab { right: 12px; bottom: 12px; padding: .5em .8em; font-size: 13px; }
  .zr-fab__long { display: none; }
  .zr-fab__short { display: inline; }
}
@media print { .zr-fab, .zr-pop, .zr-qlink { display: none !important; } }

.zr-pop { position: absolute; z-index: 901; margin: 0; padding: .4em .8em; border: 0; border-radius: 6px; background: #004d80; color: #fff;
  font-family: inherit; font-weight: 600; font-size: 13px; line-height: 1.2; letter-spacing: 0; text-transform: none; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); cursor: pointer; white-space: nowrap; }
.zr-pop:hover, .zr-pop:focus { background: #0067ac; color: #fff; outline: none; }
.zr-pop[hidden] { display: none; }

.zr-qlink { margin: .6em 0 0; text-align: right; }
.zr-link, .zr-link:hover, .zr-link:focus { margin: 0; padding: 0; border: 0; background: none; color: #6b7a88; font: inherit; font-size: .85em;
  letter-spacing: 0; text-transform: none; text-decoration: underline dotted; cursor: pointer; }
.zr-link:hover, .zr-link:focus { color: #0067ac; }
.zt > .zr-qlink { margin-top: .4em; }

.zr-dialog { width: min(34em, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: 12px;
  background: #fff; color: #222; box-shadow: 0 10px 40px rgba(0, 0, 0, .3); }
.zr-dialog::backdrop { background: rgba(0, 20, 40, .45); }
.zr-form, .zr-done { padding: 1.1em 1.25em 1.2em; }
.zr-form[hidden], .zr-done[hidden] { display: none; }
.zr-dialog .zr-title { margin: 0 0 .5em; padding: 0; font-size: 1.2em; line-height: 1.3; color: #004d80; }
.zr-where { margin: 0 0 .6em; padding: .3em .6em; border-radius: 6px; background: #f6f9fc; color: #456; font-size: .9em; }
.zr-label { display: block; margin: .7em 0 .25em; font-weight: 600; font-size: .95em; }
.zr-opt { font-weight: 400; color: #6b7a88; }
.zr-dialog .zr-input { display: block; box-sizing: border-box; width: 100%; margin: 0; padding: .5em .6em; border: 1px solid #c9d6e2; border-radius: 6px;
  background: #fff; color: #222; font: inherit; font-size: 15px; line-height: 1.4; resize: vertical; }
.zr-dialog .zr-input:focus { border-color: #0067ac; outline: 2px solid rgba(0, 103, 172, .25); }
.zr-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.zr-note { margin: .8em 0 0; font-size: .85em; color: #6b7a88; }
.zr-status { min-height: 1.3em; margin: .4em 0 0; font-size: .9em; color: #c0392b; }
.zr-status:empty { min-height: 0; }
.zr-actions { display: flex; flex-wrap: wrap; gap: .5em; margin-top: .9em; }
.zr-btn { margin: 0; padding: .55em 1.1em; border: 1px solid #c9d6e2; border-radius: 6px; background: #fff; color: #004d80;
  font-family: inherit; font-weight: 600; font-size: 15px; line-height: 1.2; letter-spacing: 0; text-transform: none; cursor: pointer; }
.zr-btn:hover, .zr-btn:focus { border-color: #0067ac; background: #eef5fb; color: #004d80; outline: none; }
.zr-btn--primary, .zr-btn--primary:hover, .zr-btn--primary:focus { border-color: #0067ac; background: #0067ac; color: #fff; }
.zr-btn--primary:hover, .zr-btn--primary:focus { background: #004d80; }
.zr-btn:disabled { opacity: .6; cursor: default; }
.zr-done p { margin: 0; }