/*!
 * WP Quiz Pro — Baribar стилі v2.2.0
 * Baribar Media, 2026
 */

/* ══ Variables ══════════════════════════════════════════════ */
:root {
  --wq-accent:    #e63946;
  --wq-correct:   #2d9e5f;
  --wq-wrong:     #e63946;
  --wq-bg:        #fff;
  --wq-bg2:       #f7f7f7;
  --wq-border:    #e8e8e8;
  --wq-text:      #1a1a1a;
  --wq-muted:     #888;
  --wq-radius:    12px;
  --wq-font:      'Inter', -apple-system, sans-serif;
  --wq-bar-color: #e63946;
}

/* ══ Base ═══════════════════════════════════════════════════ */
.wq-hidden { display: none !important; }
.wq-error  { color: var(--wq-wrong); font-size: 14px; padding: 8px; }

.wq_quizCtr {
  font-family: var(--wq-font);
  width: 100%;
  margin: 0 auto 32px;
  background: var(--wq-bg);
  border: 1.5px solid var(--wq-border);
  border-radius: var(--wq-radius);
  overflow: hidden;
  box-sizing: border-box;
}
.wq_quizCtr * { box-sizing: border-box; }

/* Loading */
.wq-loading {
  position: absolute; inset: 0;
  display: none; background: rgba(255,255,255,.75);
  z-index: 100; align-items: center; justify-content: center;
}
.wq-is-loading .wq-loading { display: flex; }
.wq-loading .wq-spinner {
  width: 32px; height: 32px;
  border: 3px solid var(--wq-border);
  border-top-color: var(--wq-accent);
  border-radius: 50%;
  animation: wq-spin .8s linear infinite;
}
@keyframes wq-spin { to { transform: rotate(360deg); } }

/* ══ Progress ═══════════════════════════════════════════════ */
.wq_quizProgressBarCtr { padding: 16px 24px 0; }

.wq_quizProgressBar {
  width: 100%; height: 12px;
  background: var(--wq-border);
  border-radius: 5px; overflow: hidden;
  position: relative; margin: 0;
  box-shadow: none; color: transparent; font-size: 0;
}
.wq_quizProgressBar > span {
  display: block; height: 100%;
  background: var(--wq-accent);
  border-radius: 5px; min-width: 0;
  padding: 0; border: none; box-shadow: none;
  transition: width .3s ease;
  position: absolute; left: 0; top: 0;
  float: none; text-align: left; margin: 0;
}

/* ══ Question ═══════════════════════════════════════════════ */
.wq_questionsCtr { padding: 0; margin: 0; }

.wq_singleQuestionWrapper { padding: 0 24px 24px; margin: 0; }
/* .wq_singleQuestionWrapper — border жоқ */

body .wq_questionTextCtr {
  background: transparent; padding: 20px 0 16px;
  float: none; width: 100%;
  margin-bottom: 0;
}
body .wq_questionTextCtr h4 {
  font-size: 18px; font-weight: 700;
  color: var(--wq-text); margin: 0; line-height: 1.4;
}

.wq_questionTextDescCtr p {
  font-size: 14px; color: var(--wq-muted);
  margin: 6px 0 0; line-height: 1.5;
}

.wq_questionMediaCtr {
  margin: 0 0 16px; border-radius: 8px; overflow: hidden;
}
.wq_quizCtr img {
  width: 100%; max-width: 100%; height: auto; display: block;
  vertical-align: middle !important;
}

/* ══ Answers ════════════════════════════════════════════════ */
.wq_questionAnswersCtr { width: 100%; padding: 0; }
.wq_answersWrapper { display: flex; flex-direction: column; gap: 10px; }
.wq_answersWrapper .row:after { content: ''; display: table; clear: both; }

/* Flat skin */
.wq-skin-flat .wq_singleAnswerCtr {
  padding: 13px 16px;
  background: var(--wq-bg2);
  border: 1.5px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: all .18s;
  margin: 0; line-height: 1.4;
}
.wq-skin-flat .wq_singleAnswerCtr:hover {
  border-color: var(--wq-accent); background: #fff5f5;
}
.wq-skin-flat .wq_singleAnswerCtr.chosen,
.wq-skin-flat .wq_singleAnswerCtr.wq_answerSelected {
  background: var(--wq-accent); border-color: var(--wq-accent);
}
.wq-skin-flat .wq_singleAnswerCtr.chosen .wq_answerTxtCtr,
.wq-skin-flat .wq_singleAnswerCtr.wq_answerSelected .wq_answerTxtCtr { color: #fff; }

.wq-skin-flat.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_correctAnswer {
  background: var(--wq-correct) !important; border-color: var(--wq-correct) !important; opacity: 1;
}
.wq-skin-flat.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_incorrectAnswer {
  background: var(--wq-wrong) !important; border-color: var(--wq-wrong) !important; opacity: 1;
}
.wq-skin-flat .wq_questionAnswered .wq_singleAnswerCtr { opacity: .55; }
.wq-skin-flat .wq_questionAnswered .wq_singleAnswerCtr.chosen { opacity: 1; }

/* Traditional skin */
.wq-skin-traditional .wq_singleAnswerCtr {
  background: var(--wq-bg2); border: 1.5px solid var(--wq-border);
  border-radius: 10px; padding: 13px 16px; margin: 0;
  cursor: pointer; transition: all .18s; line-height: 1.4;
}
.wq-skin-traditional .wq_singleAnswerCtr:hover,
.wq_singleAnswerCtr:hover { background: #fff5f5; border-color: var(--wq-accent); }
.wq-skin-traditional .wq_singleAnswerCtr.wq_answerSelected {
  background: var(--wq-accent); border-color: var(--wq-accent); color: #fff;
}
.wq-skin-traditional.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_correctAnswer {
  background: var(--wq-correct); border-color: var(--wq-correct); color: #fff; opacity: 1;
}
.wq-skin-traditional.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_incorrectAnswer {
  background: var(--wq-wrong); border-color: var(--wq-wrong); color: #fff; opacity: 1;
}
.wq-skin-traditional .wq_questionAnswered .wq_singleAnswerCtr { opacity: .55; }
.wq-skin-traditional .wq_questionAnswered .wq_singleAnswerCtr.chosen { opacity: 1; }

/* Answer text */
.wq_singleAnswerCtr .wq_answerTxtCtr {
  font-size: 15px; font-weight: 500;
  color: var(--wq-text); padding-left: 0;
  display: block; position: static; line-height: 1.4;
}
.wq_singleAnswerCtr .wq_answerTxtCtr:before,
.wq_singleAnswerCtr .wq_answerTxtCtr:after { display: none; }

/* Image answers */
.col-md-wq-6 { float: left; width: 49%; margin-bottom: 10px; }
.col-md-wq-6:nth-child(even) { float: right; }
.col-md-wq-4 { float: left; width: 32%; margin-right: 2%; margin-bottom: 10px; }
.col-md-wq-4:last-child { float: right; margin-right: 0; }

.wq_answerImgCtr {
  border-radius: 8px; overflow: hidden;
  border: 2px solid transparent; transition: border-color .18s;
}
.wq_singleAnswerCtr.chosen .wq_answerImgCtr,
.wq_singleAnswerCtr.wq_answerSelected .wq_answerImgCtr {
  border-color: var(--wq-accent);
}

/* ══ Buttons ════════════════════════════════════════════════ */
.wq_retakeQuizBtn,
.wq-force-login button,
.wq_singleQuestionWrapper .wq_continue button,
.wq_triviaQuizTimerInfoCtr button,
.wq-pay-locker button,
.wq_quizEmailCtr form button,
.wq-subscribe-locker button,
.wq_beginQuizSwiperCtr {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 12px 32px; background: var(--wq-accent); color: #fff !important;
  border: none; border-radius: 50px; font-size: 15px; font-weight: 700;
  cursor: pointer; transition: opacity .2s; font-family: var(--wq-font);
  margin: 20px 0 8px; box-shadow: none;
}
.wq_retakeQuizBtn:hover { opacity: .85; }

/* ══ Results ════════════════════════════════════════════════ */
.wq-force-action-container, .wq-results, .wq_continue, .wq-result { display: none; }
.show-played .wq-results, .wq-result.chosen { display: block; }
.force-show { display: block !important; }

.wq-results {
  padding: 32px; margin: 0;
  border: none; border-top: 1.5px solid var(--wq-border);
  background: var(--wq-bg2); font-size: 16px; text-align: center;
}
.wq-results .wq_quizTitle {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--wq-muted); display: block; margin-bottom: 8px;
}
.wq-results .wq_resultScoreCtr {
  font-size: 28px; font-weight: 900; color: var(--wq-text); margin-bottom: 4px;
}
.wq-results p { margin-bottom: 8px; color: #444; }
.wq-results img { border-radius: 10px; margin: 0 auto 16px; }
img.wq_resultImg { margin-bottom: 12px; border-radius: 8px; }

.wq_retakeQuizCtr { display: none; text-align: center; padding: 8px 0 0; }

/* ══ Sharing ════════════════════════════════════════════════ */
.wq_shareCtr, .wq-share {
  margin-top: 16px; padding-top: 16px;
  border-top: 1px solid var(--wq-border);
}
.wq_shareCtr button, .wq_quizForceShareCtr button, .wq_questionLogin button {
  font-size: 13px; font-weight: 700; line-height: 36px; height: 36px;
  min-width: 36px; margin: 6px 6px 0 0; padding: 0 12px 0 0;
  cursor: pointer; color: #fff; border: 0; border-radius: 6px;
}
.wq_shareCtr button > i { line-height: 36px; width: 36px; display: inline-block; }
.wq_shareCtr button > span {
  display: inline-block; min-width: 90px;
  padding: 0 12px; text-align: left; vertical-align: middle;
}
.wq_shareFB, .wq_forceShareFB, .wq_loginFB { background: #1877f2; }
.wq_shareTwitter { background: #000; }
.wq_shareVK { background: #4c75a3; }
.wq_shareGP { background: #d24228; }

/* ══ Explanation ════════════════════════════════════════════ */
.wq_triviaQuestionExplanation {
  margin: 16px 0 0; padding: 12px 16px;
  border: 1.5px solid var(--wq-border); border-radius: 8px;
  display: none; clear: both;
}
.wq_questionAnswered.is-correct .wq_triviaQuestionExplanation,
.wq_questionAnswered.is-incorrect .wq_triviaQuestionExplanation { display: block; }
.wq-quiz:not(.wq-should-show-correct-answer) .wq_triviaQuestionExplanation { display: none !important; }
.wq_triviaQuestionExplanation .wq-explanation-head-correct { color: var(--wq-correct); font-weight: 700; }
.wq_triviaQuestionExplanation .wq-explanation-head-incorrect { color: var(--wq-wrong); font-weight: 700; }
.wq-skin-flat .wq_triviaQuestionExplanation { border-radius: 8px; }

/* ══ Timer ══════════════════════════════════════════════════ */
.wq_triviaQuizTimerCtr {
  position: fixed; z-index: 9999; top: 80px; right: 20px;
  width: 48px; height: 48px; line-height: 48px; border-radius: 50%;
  text-align: center; color: #fff; font-weight: 700; font-size: 16px;
  background: var(--wq-accent); display: none;
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}

/* ══ Swiper ═════════════════════════════════════════════════ */
.wq-swiper {
  overflow: hidden; padding: 40px 0; position: relative;
  opacity: 0; transition: opacity .1s; margin: 0 auto;
}
.wq-swiper.loaded { opacity: 1; }
.wq-swiper.moving { transition: none; cursor: grabbing; }

.wq-swiper-item {
  display: block; overflow: hidden; position: absolute;
  background: var(--wq-bg); border: 1.5px solid var(--wq-border);
  border-radius: var(--wq-radius); box-shadow: 0 4px 20px rgba(0,0,0,.08);
  padding: 5px 5px 10px; text-align: center;
  top: 40px; left: 0; will-change: transform; cursor: grab;
}
.wq-swiper-item:not(.moving) { transition: all .2s linear; }
.wq-swiper-item-image { position: relative; border-radius: 8px; overflow: hidden; }
.wq-swiper-item-image span {
  position: absolute; bottom: 0; right: 0;
  background: rgba(0,0,0,.45); color: #fff;
  padding: 0 8px; font-size: 12px; line-height: 20px;
}
.wq-swiper-item-info { font-size: 17px; margin: 12px 0 5px; font-weight: 600; }
.wq-swiper-item-info:after { content: " "; display: block; height: 0; clear: both; }
.wq-swiper-item-title { float: left; color: var(--wq-text); padding-left: 4px; }
.wq-swiper-item-index { float: right; color: var(--wq-muted); padding-right: 4px; }

.wq-swiper-actions { text-align: center; width: 260px; padding-top: 16px; margin: 0 auto; overflow: hidden; }
.wq-swiper-actions button {
  display: inline-block; width: 48px; height: 48px; line-height: 48px;
  border-radius: 50%; border: 1.5px solid var(--wq-border); background: var(--wq-bg);
  color: var(--wq-muted); margin: 6px; font-size: 20px; cursor: pointer;
  transition: all .18s; box-shadow: 0 2px 6px rgba(0,0,0,.06); padding: 0;
}
.wq-swiper-actions button:hover { border-color: var(--wq-accent); color: var(--wq-accent); }

.wq-swiper .wq-swiper-like-icon,
.wq-swiper .wq-swiper-dislike-icon {
  position: absolute; top: 20px; right: 20px;
  width: 44px; height: 44px; line-height: 44px;
  background: var(--wq-wrong); color: #fff;
  border-radius: 50%; opacity: 0; z-index: 4; display: block;
}
.wq-swiper .wq-swiper-like-icon { background: var(--wq-correct); left: 20px; right: auto; }
.wq-swiper .liked .wq-swiper-like-icon,
.wq-swiper .disliked .wq-swiper-dislike-icon { opacity: 1; }

.wq-quiz-swiper .wq_beginQuizSwiperCtr { border-radius: 50px; }
.wq-quiz-swiper .wq-results.wq_IsSwiperResult {
  width: 100%; max-width: 380px; margin: 0 auto;
  padding: 0; border: none; background: transparent;
}
.wq-quiz-swiper .wq_IsSwiperResult h3 {
  font-size: 16px; padding: 12px; margin: 0; text-align: center;
  background: var(--wq-accent); border-radius: 10px 10px 0 0; color: #fff;
}
.wq-quiz-swiper .wq_IsSwiperResult .resultItem {
  display: table; width: 100%; padding: 12px;
  border-bottom: 1px solid var(--wq-border); background: var(--wq-bg);
}
.wq-quiz-swiper .wq_IsSwiperResult .resultImageWrapper {
  display: table-cell; width: 35%;
}
.wq-quiz-swiper .wq_IsSwiperResult .resultImageWrapper img {
  width: 100%; height: 90px; object-fit: cover; border-radius: 6px;
}
.wq-quiz-swiper .wq_IsSwiperResult .resultContent {
  display: table-cell; vertical-align: top;
  padding: 0 5px 0 16px; font-size: 14px;
}
.wq-quiz-swiper .wq_retakeSwiperBtn {
  background: var(--wq-accent); color: #fff; border-radius: 50px;
  padding: 10px 24px; border: none; cursor: pointer; font-weight: 700; margin-top: 16px;
}

/* ══ Flip Quiz ══════════════════════════════════════════════ */
.wq_quizCtr.flip_quiz .wq_singleQuestionWrapper {
  text-align: center; margin: 0 auto 24px;
  position: relative; overflow: hidden;
  width: var(--wq-question-width);
  height: var(--wq-question-height);
  border-radius: 10px;
}
.wq_quizCtr.flip_quiz .card { position: relative; color: #fff; }
.wq_quizCtr.flip_quiz .wq-question:not(.no-flip) { perspective: 1000px; }
.wq_quizCtr.flip_quiz .wq-question:not(.no-flip) .card {
  transform: rotateY(0deg); transition: .5s;
  transform-style: preserve-3d;
  display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr;
}
.wq_quizCtr.flip_quiz .wq-question:not(.no-flip) .front,
.wq_quizCtr.flip_quiz .wq-question:not(.no-flip) .back {
  transform-style: preserve-3d; backface-visibility: hidden;
  cursor: pointer; min-height: 200px;
  grid-area: 1/1/2/2; height: 100%;
}
.wq_quizCtr.flip_quiz .wq-question:not(.no-flip) .back { transform: rotateY(180deg); }
.wq_quizCtr.flip_quiz .wq-question:not(.no-flip).is-flipped .card { transform: rotateY(180deg); }
.wq_quizCtr.flip_quiz .desc {
  position: absolute; left: 0; top: 0; right: 0; bottom: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; line-height: 1.4; text-align: center; padding: 20px;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}
.wq_quizCtr.flip_quiz .top-desc {
  position: absolute; left: 0; top: 0; right: 0;
  height: 36px; line-height: 36px; background: rgba(0,0,0,.4);
  font-size: 16px; text-align: center;
}

/* ══ List Quiz ══════════════════════════════════════════════ */
.wq_quizCtr.listquiz_quiz .wq_questionTextCtr {
  background: transparent; padding: 0 0 12px;
  display: flex; align-items: center; gap: 12px; width: 100%;
}
.wq_quizCtr.listquiz_quiz .wq-question-number {
  background: var(--wq-accent); color: #fff;
  width: 48px; height: 48px; line-height: 48px; border-radius: 50%;
  font-size: 18px; font-weight: 800; flex-shrink: 0; text-align: center;
}
.wq_quizCtr.listquiz_quiz .wq-question-bullet {
  width: 5px; height: 20px; border-radius: 3px;
  background: var(--wq-accent); flex-shrink: 0;
}
.wq_quizCtr.listquiz_quiz .wq-question-title { flex: 1; padding: 0; }
.wq_quizCtr.listquiz_quiz .wq-question-votes { flex: 0 0 auto; display: flex; gap: 6px; }

.wq_quizCtr.listquiz_quiz .wq-question-vote-btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 48px; height: 48px; border: 1.5px solid var(--wq-border);
  border-radius: 8px; background: var(--wq-bg);
  cursor: pointer; transition: all .18s; padding: 3px 0 0; line-height: 1;
}
.wq_quizCtr.listquiz_quiz .wq-question-vote-btn .icon {
  width: 0; height: 0; border: 5px solid transparent; display: block;
}
.wq_quizCtr.listquiz_quiz .wq-question-vote-btn .number { font-size: 13px; font-weight: 700; }
.wq_quizCtr.listquiz_quiz .wq-question-vote-btn .text { font-size: 10px; }

.wq_quizCtr.listquiz_quiz .wq-question-vote-up-btn .icon {
  border-top-color: transparent; border-bottom-color: var(--wq-correct); transform: translateY(-3px);
}
.wq_quizCtr.listquiz_quiz .wq-question-vote-down-btn .icon {
  border-top-color: var(--wq-wrong); transform: translateY(3px);
}
.wq_quizCtr.listquiz_quiz .wq-question-vote-up-btn:not(.is-voted):hover { border-color: var(--wq-correct); color: var(--wq-correct); }
.wq_quizCtr.listquiz_quiz .wq-question-vote-up-btn.is-voted { background: var(--wq-correct); border-color: var(--wq-correct); color: #fff; cursor: unset; }
.wq_quizCtr.listquiz_quiz .wq-question-vote-down-btn:not(.is-voted):hover { border-color: var(--wq-wrong); color: var(--wq-wrong); }
.wq_quizCtr.listquiz_quiz .wq-question-vote-down-btn.is-voted { background: var(--wq-wrong); border-color: var(--wq-wrong); color: #fff; cursor: unset; }

.wq_quizCtr.listquiz_quiz .wq_singleQuestionWrapper {
  text-align: center; margin: 0 auto 24px; overflow: hidden; border-radius: 10px;
  width: var(--wq-question-width); height: var(--wq-question-height);
}
.wq_quizCtr.listquiz_quiz .desc {
  position: absolute; left: 0; top: 0; right: 0; bottom: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; text-shadow: 0 1px 2px rgba(0,0,0,.4); padding: 20px;
}
.wq_quizCtr.listquiz_quiz .top-desc {
  position: absolute; left: 0; top: 0; right: 0;
  height: 36px; line-height: 36px; background: rgba(0,0,0,.4); font-size: 16px;
}

/* ══ Hint ════════════════════════════════════════════════════ */
.wq-question-hint { margin-top: 12px; overflow: hidden; }
.wq-question-hint a { font-size: 12px; float: right; color: var(--wq-muted); text-decoration: none; }
.wq-question-hint-content {
  display: none; clear: both; margin-bottom: 8px;
  padding: 12px 14px; border: 1.5px solid var(--wq-border);
  border-radius: 8px; color: var(--wq-text); font-size: 14px; line-height: 1.5;
}

/* ══ Subscribe/Email ════════════════════════════════════════ */
.wq-subscribe-locker {
  background: var(--wq-bg2); padding: 24px; margin-top: 24px;
  border-radius: 10px; border: 1.5px solid var(--wq-border); text-align: left;
}
.wq-subscribe-locker__heading { font-size: 18px; font-weight: 800; margin-bottom: 16px; }
.wq-subscribe-locker__field { margin-bottom: 16px; }
.wq-subscribe-locker__field input[type="text"],
.wq-subscribe-locker__field input[type="email"],
.wq_quizEmailCtr form input[type="text"],
.wq_quizEmailCtr form input[type="email"] {
  width: 100%; height: 48px; padding: 0 14px;
  border: 1.5px solid var(--wq-border); border-radius: 8px;
  font-size: 15px; font-family: var(--wq-font); outline: none; transition: border-color .18s;
}
.wq-subscribe-locker__field input:focus,
.wq_quizEmailCtr form input:focus { border-color: var(--wq-accent); }
.wq_quizEmailCtr form p:first-child { font-size: 18px; font-weight: 800; margin-bottom: 16px; }
.wq_quizEmailCtr form div { margin-bottom: 16px; }
.wq_quizEmailCtr form label { display: block; margin-bottom: 4px; }

/* ══ Popup ══════════════════════════════════════════════════ */
.mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; position: fixed; background: rgba(0,0,0,.7); }
.mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; }
.mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; box-sizing: border-box; }
.mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; }
.mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; }
.mfp-hide { display: none !important; }
.mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-align: center; color: #fff; font-size: 28px; cursor: pointer; background: transparent; border: 0; padding: 0; }
.mfp-close:hover { opacity: 1; }
.wq-popup { position: relative; background: var(--wq-bg); padding: 24px; max-width: 500px; margin: 20px auto; border-radius: var(--wq-radius); }
.mfp-content .wq-results { margin-top: 0; display: block; }

/* ══ FB Quiz ════════════════════════════════════════════════ */
.wq-quiz-fb_quiz .wq_singleQuestionWrapper { text-align: center; position: relative; }
.wq-quiz-fb_quiz .wq_questionsCtr { margin-bottom: 0; }
.wq-quiz-fb_quiz .wq-results { margin-top: 0; border: 0; padding: 0; background: transparent; }
.wq-quiz-fb_quiz .wq_questionMediaCtr { margin: 20px auto; }
.wq-quiz-fb_quiz .wq_loader-container {
  position: absolute; top: 0; bottom: 0; width: 100%; height: 100%;
  background: rgba(255,255,255,.9); z-index: 9999; display: none;
}

/* ══ Checked answers ════════════════════════════════════════ */
.wq-checked-answers-list { display: none; margin-top: 16px; }
.wq-checked-answers-list.must-show { display: block; }
.wq-checked-answers-list__question { margin-bottom: 12px; }
.wq-checked-answers-list__question-title { font-weight: 700; margin-bottom: 4px; }
.wq-checked-answers-list__question-desc { font-size: 85%; color: var(--wq-muted); margin-top: 4px; }
.wq-checked-answers-list .is-correct { color: var(--wq-correct); }
.wq-checked-answers-list .is-incorrect { color: var(--wq-wrong); }

/* ══ Multiple (one question at a time) ══════════════════════ */
/* Сұрақтар PHP-да style="display:none" арқылы жасырылады (index>0) */
/* JS .show()/.hide() арқылы басқарылады */
.wq-quiz.multiple .wq-is-ad .wq_continue { display: block; }
.wq-quiz.has-intro .wq-progress-bar-container,
.wq-quiz.has-intro .wq-questions,
.wq-quiz.has-intro .wq_promoteQuizCtr { display: none; }

/* ══ Misc ════════════════════════════════════════════════════ */
.wq_promoteQuizCtr { text-align: right; font-size: 12px; color: var(--wq-muted); padding: 6px 24px; }
.wq_promoteQuizCtr a { color: var(--wq-muted); }
.wq_embedToggleQuiz { display: none; clear: both; margin: 12px 0; }
.wq-embed-toggle { float: left; }
.wq-force-action-container { background: var(--wq-bg2); padding: 24px; border-top: 1.5px solid var(--wq-border); }
.wq_quizForceShareCtr { text-align: center; }
.wq_quizForceShareCtr p { font-size: 18px; font-weight: 700; margin-bottom: 12px; }
.quiz-pro-clearfix:before, .quiz-pro-clearfix:after { display: table; content: ' '; }
.quiz-pro-clearfix:after { clear: both; }

/* ══ Icon font ══════════════════════════════════════════════ */
@font-face {
  font-family: 'wq-icon';
  src: url('../fonts/wq-icon.woff2') format('woff2'),
       url('../fonts/wq-icon.woff')  format('woff'),
       url('../fonts/wq-icon.ttf')   format('truetype');
  font-weight: normal; font-style: normal;
}
[class^="wq-icon-"]:before, [class*=" wq-icon-"]:before {
  font-family: 'wq-icon'; font-style: normal; font-weight: normal;
  display: inline-block; width: 1em; text-align: center;
  -webkit-font-smoothing: antialiased;
}
.wq-icon-undo:before    { content: '\e800'; }
.wq-icon-facebook:before { content: '\f09a'; }
.wq-icon-spinner:before  { content: '\f110'; }
.animate-spin { animation: wq-spin 1.5s infinite linear; display: inline-block; }

/* ══ Mobile ═════════════════════════════════════════════════ */
@media (max-width: 600px) {
  .wq-results { padding: 24px 20px; }
  .wq_singleQuestionWrapper { padding: 16px 20px 20px; }
  body .wq_questionTextCtr h4 { font-size: 16px; }
  .col-md-wq-4 { width: 49%; margin-right: 2%; }
  .col-md-wq-4:nth-child(2n) { float: right; margin-right: 0; }
  .col-md-wq-4:nth-child(2n+1) { float: left; }
}
@media (max-width: 480px) {
  .wq_retakeQuizBtn { font-size: 14px; padding: 10px 24px; }
  .wq-results { font-size: 14px; }
}