/* Giovani – Search quiz dropdown (upravené: biele pozadie panelu, zlaté menej zaoblené tlačidlá, grid s obrázkami) */
:root{
  --gq-ink:#1c1c1c; --gq-bg:#fff; /* panel teraz biely */
  --gq-soft:#fff3cd;
  --gq-brand:#a67c00; --gq-b1:#e7cb7f; --gq-b2:#cfb672; --gq-br:#e7cb7f;
}

.search.quiz-enabled { position: relative; }

.gq-panel {
  position: absolute; left: 0; top: calc(100% + 8px);
  width: min(680px, 96vw);
  background: var(--gq-bg); /* biele pozadie bubliny */
  color: var(--gq-ink);
  border: 1px solid var(--gq-br);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(0,0,0,.16);
  z-index: 10050;
  padding: 18px;
  display: none;
}
.gq-panel.gq-open { display: block; animation: gqFade .18s ease both; }
@keyframes gqFade { from {opacity: 0; transform: translateY(6px);} to {opacity: 1; transform: none;} }

.gq-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom: 10px; }
.gq-title { font-weight:700; color: var(--gq-brand); font-size: 1.05rem; }
.gq-close { background: transparent; border: none; cursor: pointer; font-weight:700; color:#666; }
.gq-close:hover { color: var(--gq-brand); }

.gq-progress { font-size: .9rem; color:#666; margin-bottom: 6px; }

.gq-q h3 { margin: 0 0 10px; font-size: 1rem; text-align: center; }
.gq-opts { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }

/* Zlaté, menej zaoblené tlačidlá */
.gq-chip {
  padding: 10px 14px;
  border-radius: 10px;                 /* menej zaoblené */
  border:1px solid var(--gq-b2);
  background: var(--gq-b1);            /* zlaté */
  color: var(--gq-ink);
  font-weight:700;
  cursor:pointer;
  transition: background .2s ease, transform .06s ease, border-color .2s ease, box-shadow .2s ease;
}
.gq-chip:hover { background: var(--gq-b2); transform: translateY(-1px); }
.gq-chip[aria-pressed="true"] { box-shadow: inset 0 0 0 2px rgba(0,0,0,.06); border-color:#bfa764; }
.gq-chip:focus-visible { outline: 2px solid var(--gq-brand); outline-offset: 2px; }

.gq-controls { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top: 10px; }
.gq-btn {
  padding: 10px 16px; border-radius: 10px; border: none; background: var(--gq-b1);
  font-weight: 700; cursor: pointer; transition: background .25s ease;
}
.gq-btn:hover { background: var(--gq-b2); }
.gq-btn.secondary { background: #f6f1df; border:1px solid var(--gq-br); font-weight:600; }
.gq-btn.secondary:hover { background:#efe6c8; }

/* Výsledky s obrázkami – responzívny grid */
.gq-result { margin-top: 8px; }
.gq-result h4 { margin: 0 0 10px; color: var(--gq-brand); }

.gq-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.gq-card {
  display:flex; align-items:center; gap:12px;
  background:#fff; border:1px solid var(--gq-br); border-radius: 12px; padding: 10px;
}
.gq-pic { display:block; flex:0 0 auto; }
.gq-thumb { width:64px; height:64px; object-fit:cover; border-radius: 10px; border:1px solid #eee; background:#fafafa; }
.gq-info { min-width:0; }
.gq-title { font-weight:700; display:inline-block; }
.gq-meta { display:block; color:#555; font-size:.92rem; margin-top:2px; }

.gq-link { color: var(--gq-brand); text-decoration: none; }
.gq-link:hover { text-decoration: underline; }

/* Mobil & väčšie displeje */
@media (min-width: 480px){
  .gq-grid { grid-template-columns: 1fr 1fr; }
  .gq-thumb { width:68px; height:68px; }
}
@media (min-width: 860px){
  .gq-grid { grid-template-columns: 1fr 1fr 1fr; }
  .gq-thumb { width:72px; height:72px; }
}

/* Bezpečné pretekanie na úzkych displejoch */
.gq-title, .gq-meta { word-break: break-word; }