/*
 * Baribar Quiz — WP Quiz Pro стиль жаңартуы
 * Baribar News тема стиліне сай
 * Version: 1.0
 */

/* ════════════════════════════════════════════
   VARIABLES
════════════════════════════════════════════ */
.wq_quizCtr {
  --bb-black:    #111;
  --bb-gray-7:   #444;
  --bb-gray-5:   #888;
  --bb-gray-3:   #bbb;
  --bb-gray-1:   #f4f4f4;
  --bb-white:    #fff;
  --bb-border:   #e8e8e8;
  --bb-radius:   10px;
  --bb-font:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --bb-gap:      20px;
  --bb-accent:   #e63946;
  --bb-accent-h: #c1121f;
  --bb-correct:  #2d9e6b;
  --bb-wrong:    #e63946;
  --bb-shadow:   0 2px 12px rgba(0,0,0,.07);
  --bb-shadow-h: 0 4px 24px rgba(0,0,0,.12);
  --bb-trans:    0.2s ease;

  font-family: var(--bb-font);
  color: var(--bb-black);
  width: 100%;
  margin-bottom: 32px;
  box-sizing: border-box;
}

/* ════════════════════════════════════════════
   INTRO БЛОГЫ
════════════════════════════════════════════ */
.wq_quizCtr .wq-intro {
  background: var(--bb-white);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  overflow: hidden;
  margin-bottom: var(--bb-gap);
  box-shadow: var(--bb-shadow);
}

.wq_quizCtr .wq-intro img {
  width: 100%;
  height: auto;
  display: block;
}

.wq_quizCtr .wq-intro-content {
  padding: 24px;
}

.wq_quizCtr .wq-intro h2,
.wq_quizCtr .wq-intro .wq-quiz-title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 10px;
  color: var(--bb-black);
}

.wq_quizCtr .wq-intro p {
  font-size: 15px;
  color: var(--bb-gray-7);
  margin: 0 0 20px;
  line-height: 1.6;
}

/* ════════════════════════════════════════════
   PROGRESS BAR
════════════════════════════════════════════ */
.wq_quizProgressBarCtr {
  margin-bottom: 24px;
}

.wq_quizProgressBar {
  width: 100%;
  height: 6px;
  background: var(--bb-gray-1);
  border-radius: 99px;
  overflow: hidden;
  box-shadow: none;
  margin: 0;
  font-size: 0;
}

.wq_quizProgressBar > span {
  display: block;
  height: 100%;
  background: var(--bb-accent);
  border-radius: 99px;
  border: none;
  box-shadow: none;
  min-width: 6px;
  padding: 0;
  transition: width 0.4s cubic-bezier(.4,0,.2,1);
  text-indent: -9999px;
}

.wq-progress-label {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--bb-gray-5);
  margin-bottom: 6px;
  font-weight: 500;
}

/* ════════════════════════════════════════════
   СҰРАҚ БЛОГЫ
════════════════════════════════════════════ */
.wq_quizCtr .wq-question,
.wq_quizCtr .wq_singleQuestionWrapper {
  background: var(--bb-white);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  overflow: hidden;
  margin-bottom: 16px;
  box-shadow: var(--bb-shadow);
  transition: box-shadow var(--bb-trans);
}

.wq_quizCtr .wq-question:hover,
.wq_quizCtr .wq_singleQuestionWrapper:hover {
  box-shadow: var(--bb-shadow-h);
}

/* Сұрақ нөмірі + мәтін */
body .wq_questionTextCtr {
  background: var(--bb-white);
  padding: 20px 20px 16px;
  float: none;
  width: 100%;
  box-sizing: border-box;
  border-bottom: 1px solid var(--bb-border);
}

body .wq_questionTextCtr h4 {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0;
  color: var(--bb-black);
}

.wq_questionTextDescCtr p {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 8px;
  color: var(--bb-gray-7);
}

/* Сұрақ нөмірі badge */
.wq-question-number-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bb-accent);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  margin-right: 10px;
  flex-shrink: 0;
}

/* Сурет */
.wq_questionMediaCtr {
  width: 100%;
  margin: 0;
  overflow: hidden;
}

.wq_questionMediaCtr img,
.wq_questionImage img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16/9;
  object-fit: cover;
}

/* ════════════════════════════════════════════
   ЖАУАПТАР
════════════════════════════════════════════ */
.wq_questionAnswersCtr {
  padding: 16px 20px 20px;
}

/* FLAT SKIN — бастапқы стиль жаңарту */
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--bb-white);
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  padding: 12px 16px;
  margin: 0 0 10px;
  cursor: pointer;
  transition: all var(--bb-trans);
  line-height: 1.4;
  color: var(--bb-black);
  position: relative;
}

.wq-quiz.wq-skin-flat .wq_singleAnswerCtr:last-child {
  margin-bottom: 0;
}

.wq-quiz.wq-skin-flat .wq_singleAnswerCtr:hover {
  background: #fff8f8;
  border-color: var(--bb-accent);
  color: var(--bb-black);
  transition: all var(--bb-trans);
}

/* Таңдалған жауап */
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr.chosen,
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr.wq_answerSelected {
  background: #fff3f3;
  border-color: var(--bb-accent);
  color: var(--bb-black);
  transition: all var(--bb-trans);
}

/* Дұрыс жауап */
.wq-quiz.wq-skin-flat.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_correctAnswer {
  background: #edfaf4;
  border-color: var(--bb-correct);
  color: var(--bb-correct);
  opacity: 1;
}

/* Қате жауап */
.wq-quiz.wq-skin-flat.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_incorrectAnswer {
  background: #fff3f3;
  border-color: var(--bb-wrong);
  color: var(--bb-wrong);
  opacity: 1;
}

/* Жауаберілген сұрақ — сөнген жауаптар */
.wq-quiz.wq-skin-flat .wq_questionAnswered .wq_singleAnswerCtr {
  opacity: 0.45;
  pointer-events: none;
}

.wq-quiz.wq-skin-flat .wq_questionAnswered .wq_singleAnswerCtr.chosen,
.wq-quiz.wq-skin-flat .wq_questionAnswered .wq_singleAnswerCtr.wq_correctAnswer {
  opacity: 1;
  pointer-events: auto;
}

/* Жауап мәтіні */
.wq_singleAnswerCtr .wq_answerTxtCtr {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  padding-left: 0;
  cursor: pointer;
  color: inherit;
  position: static;
  display: block;
}

/* Жауап checkbox жасыру (біздің custom стиль арқылы) */
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr .wq_answerTxtCtr:before,
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr.chosen .wq_answerTxtCtr:after {
  display: none;
}

/* Жауап алдындағы дөңгелек */
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr:before {
  content: '';
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 2px solid var(--bb-border);
  border-radius: 50%;
  transition: all var(--bb-trans);
  background: var(--bb-white);
}

.wq-quiz.wq-skin-flat .wq_singleAnswerCtr:hover:before {
  border-color: var(--bb-accent);
}

.wq-quiz.wq-skin-flat .wq_singleAnswerCtr.chosen:before,
.wq-quiz.wq-skin-flat .wq_singleAnswerCtr.wq_answerSelected:before {
  border-color: var(--bb-accent);
  background: var(--bb-accent);
  box-shadow: inset 0 0 0 3px #fff;
}

.wq-quiz.wq-skin-flat.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_correctAnswer:before {
  border-color: var(--bb-correct);
  background: var(--bb-correct);
  box-shadow: inset 0 0 0 3px #fff;
}

.wq-quiz.wq-skin-flat.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_incorrectAnswer:before {
  border-color: var(--bb-wrong);
  background: var(--bb-wrong);
  box-shadow: inset 0 0 0 3px #fff;
}

/* Суретті жауаптар */
.wq_answerImgCtr {
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 8px;
}

.wq_answerImgCtr img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}

.wq_singleAnswerCtr:hover .wq_answerImgCtr img {
  transform: scale(1.03);
}

/* TRADITIONAL SKIN */
.wq-skin-traditional .wq_singleAnswerCtr {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--bb-white);
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  padding: 12px 16px;
  margin: 0 0 10px;
  cursor: pointer;
  transition: all var(--bb-trans);
  line-height: 1.4;
  color: var(--bb-black);
}

.wq-skin-traditional .wq_singleAnswerCtr:hover,
.wq_singleAnswerCtr:hover,
.wq_singleAnswerCtr.chosen {
  background: #fff8f8;
  border-color: var(--bb-accent);
  color: var(--bb-black);
  transition: all var(--bb-trans);
}

.wq-skin-traditional .wq_singleAnswerCtr.wq_answerSelected {
  background: var(--bb-correct);
  border-color: var(--bb-correct);
  color: #fff;
}

.wq-skin-traditional.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_correctAnswer {
  background: #edfaf4;
  border-color: var(--bb-correct);
  color: var(--bb-correct);
  opacity: 1;
}

.wq-skin-traditional.wq-should-show-correct-answer .wq_singleAnswerCtr.wq_incorrectAnswer {
  background: #fff3f3;
  border-color: var(--bb-wrong);
  color: var(--bb-wrong);
  opacity: 1;
}

.wq-skin-traditional .wq_questionTextCtr {
  background: var(--bb-white);
}

/* ════════════════════════════════════════════
   БАТЫРМАЛАР
════════════════════════════════════════════ */
.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-quiz-swiper .wq_beginQuizSwiperCtr {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--bb-font);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  padding: 13px 28px;
  border: none;
  border-radius: 8px;
  background: var(--bb-accent);
  color: #fff;
  cursor: pointer;
  transition: background var(--bb-trans), transform var(--bb-trans), box-shadow var(--bb-trans);
  box-shadow: 0 2px 8px rgba(230,57,70,.25);
  text-decoration: none;
  margin: 20px 0 8px;
}

.wq_retakeQuizBtn:hover,
.wq-force-login button:hover,
.wq_singleQuestionWrapper .wq_continue button:hover,
.wq_triviaQuizTimerInfoCtr button:hover,
.wq-pay-locker button:hover,
.wq_quizEmailCtr form button:hover,
.wq-subscribe-locker button:hover,
.wq-quiz-swiper .wq_beginQuizSwiperCtr:hover {
  background: var(--bb-accent-h);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(230,57,70,.35);
}

.wq_retakeQuizBtn:active,
.wq-force-login button:active,
.wq_singleQuestionWrapper .wq_continue button:active {
  transform: translateY(0);
}

.wq_continue {
  text-align: center;
  padding: 0 20px 20px;
}

/* ════════════════════════════════════════════
   НӘТИЖЕЛЕР БЛОГЫ
════════════════════════════════════════════ */
.wq_quizCtr .wq-results {
  background: var(--bb-white);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  padding: 24px;
  margin: 20px 0;
  font-size: 16px;
  box-shadow: var(--bb-shadow);
}

.wq-results .wq_quizTitle {
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-bottom: 16px;
  color: var(--bb-black);
}

/* Балл */
.wq-results .wq_resultScoreCtr {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--bb-gray-1);
  border-radius: 8px;
  padding: 12px 20px;
  font-size: 28px;
  font-weight: 800;
  color: var(--bb-accent);
  margin-bottom: 16px;
}

/* Нәтиже суреті */
.wq-results img {
  width: 100%;
  border-radius: 8px;
  margin-bottom: 16px;
}

/* Нәтиже сипаттамасы */
.wq-results p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--bb-gray-7);
  margin: 0;
}

/* ════════════════════════════════════════════
   БӨЛІСУ БАТЫРМАЛАРЫ
════════════════════════════════════════════ */
.wq_shareCtr,
.wq_quizForceShareCtr {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wq_shareCtr button,
.wq_quizForceShareCtr button,
.wq_questionLogin button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--bb-font);
  font-size: 13px;
  font-weight: 600;
  height: 38px;
  min-width: auto;
  padding: 0 16px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: opacity var(--bb-trans), transform var(--bb-trans);
  margin: 0;
}

.wq_shareCtr button:hover,
.wq_quizForceShareCtr button:hover {
  opacity: 0.85;
  transform: translateY(-1px);
}

.wq_shareCtr button > i,
.wq_quizForceShareCtr button > i {
  width: auto;
  line-height: 1;
  display: inline-flex;
  margin: 0;
}

.wq_shareCtr button > span,
.wq_quizForceShareCtr button > span {
  border: none;
  padding: 0;
  min-width: auto;
  text-align: left;
  vertical-align: middle;
  display: inline;
}

.wq_shareCtr .wq_shareFB,
.wq_quizForceShareCtr .wq_forceShareFB,
.wq_questionLogin .wq_loginFB {
  background: #1877f2;
}

.wq_shareCtr .wq_shareTwitter { background: #1da1f2; }
.wq_shareCtr .wq_shareGP      { background: #ea4335; }
.wq_shareCtr .wq_shareVK      { background: #4a76a8; }

/* ════════════════════════════════════════════
   ТРИVIA ТАЙМЕР
════════════════════════════════════════════ */
.wq_triviaQuizTimerCtr {
  position: fixed;
  z-index: 9999;
  top: 80px;
  right: 20px;
  left: auto;
  width: 52px;
  height: 52px;
  line-height: 52px;
  border-radius: 50%;
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  background: var(--bb-accent);
  box-shadow: var(--bb-shadow-h);
  display: none;
}

/* Дұрыс/қате түсіндірме */
.wq_triviaQuestionExplanation {
  background: var(--bb-gray-1);
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  padding: 14px 16px;
  margin: 12px 0 0;
  display: none;
  font-size: 14px;
  line-height: 1.6;
  color: var(--bb-gray-7);
}

.wq_questionAnswered.is-incorrect .wq_triviaQuestionExplanation,
.wq_questionAnswered.is-correct .wq_triviaQuestionExplanation {
  display: block;
}

.wq_triviaQuestionExplanation .wq-explanation-head-correct {
  color: var(--bb-correct);
  font-weight: 700;
  font-size: 15px;
  display: block;
  margin-bottom: 4px;
}

.wq_triviaQuestionExplanation .wq-explanation-head-incorrect {
  color: var(--bb-wrong);
  font-weight: 700;
  font-size: 15px;
  display: block;
  margin-bottom: 4px;
}

.wq-skin-flat .wq_triviaQuestionExplanation {
  background: var(--bb-gray-1);
  border-color: var(--bb-border);
}

/* ════════════════════════════════════════════
   PERSONALITY НӘТИЖЕСІ
════════════════════════════════════════════ */
.wq-quiz-personality .wq-result {
  background: var(--bb-white);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  overflow: hidden;
  box-shadow: var(--bb-shadow);
}

.wq-quiz-personality .wq-result img {
  width: 100%;
  height: auto;
  border-radius: 0;
  margin: 0;
}

.wq-quiz-personality .wq-result-content {
  padding: 20px;
}

/* Жауап суреттері торы */
.wq-quiz-personality .col-md-wq-6 {
  float: left;
  width: calc(50% - 6px);
}

.wq-quiz-personality .col-md-wq-6:nth-child(odd) {
  margin-right: 12px;
}

.wq-quiz-personality .col-md-wq-4 {
  float: left;
  width: calc(33.333% - 8px);
  margin-right: 12px;
}

.wq-quiz-personality .col-md-wq-4:last-child {
  margin-right: 0;
}

/* ════════════════════════════════════════════
   FORCE ACTION / EMAIL ФОРМ
════════════════════════════════════════════ */
.wq-quiz.wq-skin-flat .wq_quizForceActionCtr {
  background: var(--bb-gray-1);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  padding: 24px;
  margin-top: 20px;
  float: left;
  width: 100%;
  box-sizing: border-box;
}

.wq_quizEmailCtr form p:first-child {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
  text-align: left;
  color: var(--bb-black);
}

.wq_quizEmailCtr form input[type='text'],
.wq_quizEmailCtr form input[type='email'] {
  font-family: var(--bb-font);
  font-size: 15px;
  width: 100%;
  height: 46px;
  padding: 0 14px;
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  box-sizing: border-box;
  margin-top: 4px;
  color: var(--bb-black);
  background: var(--bb-white);
  transition: border-color var(--bb-trans);
  outline: none;
}

.wq_quizEmailCtr form input:focus {
  border-color: var(--bb-accent);
}

.wq_quizEmailCtr form label {
  font-size: 13px;
  font-weight: 600;
  color: var(--bb-gray-7);
  display: block;
  margin-bottom: 4px;
}

.wq_quizEmailCtr form div {
  margin-bottom: 16px;
}

.wq_quizEmailCtr form button {
  margin: 0;
  width: 100%;
}

/* Subscribe locker */
.wq-subscribe-locker {
  background: var(--bb-gray-1);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  padding: 24px;
  margin-top: 24px;
  text-align: left;
}

.wq-subscribe-locker__heading {
  font-size: 18px;
  font-weight: 700;
  color: var(--bb-black);
  margin-bottom: 16px;
}

.wq-subscribe-locker__field input[type="text"],
.wq-subscribe-locker__field input[type="email"] {
  font-family: var(--bb-font);
  font-size: 15px;
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  height: 46px;
  padding: 0 14px;
  margin-top: 6px;
  width: 100%;
  box-sizing: border-box;
  transition: border-color var(--bb-trans);
  outline: none;
}

.wq-subscribe-locker__field input:focus {
  border-color: var(--bb-accent);
}

/* ════════════════════════════════════════════
   FLIP QUIZ
════════════════════════════════════════════ */
.wq_quizCtr.flip_quiz .wq_singleQuestionWrapper {
  border-radius: var(--bb-radius);
  overflow: hidden;
  box-shadow: var(--bb-shadow);
}

.wq_quizCtr.flip_quiz .desc {
  font-size: 26px;
  text-shadow: 0 1px 4px rgba(0,0,0,.35);
  padding: 24px;
}

.wq_quizCtr.flip_quiz .top-desc {
  background: rgba(0,0,0,.5);
  font-size: 15px;
}

.wq_quizCtr.flip_quiz .wq_questionTextCtr {
  padding: 0 0 12px;
  background: transparent;
  border: none;
}

.wq_quizCtr.flip_quiz .wq-question-vote-btn {
  background: transparent;
}

/* ════════════════════════════════════════════
   SWIPER QUIZ
════════════════════════════════════════════ */
.wq-swiper {
  border-radius: var(--bb-radius);
  overflow: visible;
  padding: 40px 0;
}

.wq-swiper-item {
  background: var(--bb-white);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  box-shadow: var(--bb-shadow-h);
  padding: 8px 8px 16px;
}

.wq-swiper-item-info {
  font-size: 16px;
  font-weight: 600;
  color: var(--bb-black);
}

.wq-swiper-actions button {
  background: var(--bb-white);
  border: 1.5px solid var(--bb-border);
  border-radius: 50%;
  box-shadow: var(--bb-shadow);
  transition: all var(--bb-trans);
  color: var(--bb-gray-7);
  font-size: 20px;
}

.wq-swiper-actions button:hover {
  background: var(--bb-gray-1);
  box-shadow: var(--bb-shadow-h);
  transform: scale(1.08);
}

.wq-swiper-actions button i {
  color: var(--bb-correct);
}

.wq-swiper-actions button i.fa-thumbs-o-down {
  color: var(--bb-wrong);
}

/* Swiper нәтиже */
.wq-quiz-swiper .wq-results.wq_IsSwiperResult {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  background: var(--bb-white);
  overflow: hidden;
}

.wq-quiz-swiper .wq_IsSwiperResult h3 {
  background: var(--bb-accent);
  color: #fff;
  font-size: 15px;
  padding: 14px 16px;
  margin: 0;
  border-radius: 0;
}

.wq-quiz-swiper .wq_IsSwiperResult .resultItem {
  padding: 12px 16px;
  border-bottom: 1px solid var(--bb-border);
  background: var(--bb-white);
}

.wq-quiz-swiper .wq_IsSwiperResult .resultImageWrapper .indexWrapper {
  background: var(--bb-accent);
  border-radius: 0;
}

.wq-quiz-swiper .wq_retakeSwiperBtn {
  font-family: var(--bb-font);
  font-weight: 600;
  font-size: 14px;
  background: var(--bb-gray-1);
  color: var(--bb-gray-7);
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  padding: 10px 20px;
  margin-top: 12px;
  cursor: pointer;
  transition: all var(--bb-trans);
}

.wq-quiz-swiper .wq_retakeSwiperBtn:hover {
  background: var(--bb-accent);
  color: #fff;
  border-color: var(--bb-accent);
}

.wq-quiz-swiper .wq_IsSwiperResult .userVote {
  background: var(--bb-correct);
  border-radius: 20px;
  font-size: 13px;
}

.wq-quiz-swiper .wq_IsSwiperResult .userVote.negativeVote {
  background: var(--bb-wrong);
}

/* Swiper like/dislike иконкалары */
.wq-swiper .wq-swiper-like-icon {
  background: var(--bb-correct);
  border-radius: 50%;
  box-shadow: var(--bb-shadow);
}

.wq-swiper .wq-swiper-dislike-icon {
  background: var(--bb-wrong);
  border-radius: 50%;
  box-shadow: var(--bb-shadow);
}

/* ════════════════════════════════════════════
   LISTQUIZ
════════════════════════════════════════════ */
.wq_quizCtr.listquiz_quiz .wq_singleQuestionWrapper {
  border-radius: var(--bb-radius);
  box-shadow: var(--bb-shadow);
  overflow: hidden;
}

.wq_quizCtr.listquiz_quiz .wq-question-number {
  background: var(--bb-accent);
  color: #fff;
  height: 50px;
  line-height: 50px;
  flex-basis: 50px;
  font-size: 24px;
  font-weight: 800;
  margin-right: 14px;
  border-radius: 0;
}

.wq_quizCtr.listquiz_quiz .wq-question-bullet {
  background: var(--bb-accent);
  width: 4px;
  height: 20px;
  border-radius: 2px;
  margin-right: 14px;
}

.wq_quizCtr.listquiz_quiz .wq-question-vote-btn {
  border: 1.5px solid var(--bb-border);
  border-radius: 8px;
  background: var(--bb-white);
  color: var(--bb-gray-7);
  height: 50px;
  width: 50px;
  transition: all var(--bb-trans);
}

.wq_quizCtr.listquiz_quiz .wq-question-vote-btn:hover {
  border-color: var(--bb-accent);
  color: var(--bb-accent);
}

.wq_quizCtr.listquiz_quiz .wq-question-vote-up-btn.is-voted {
  background: var(--bb-correct);
  border-color: var(--bb-correct);
  color: #fff;
}

.wq_quizCtr.listquiz_quiz .wq-question-vote-down-btn.is-voted {
  background: var(--bb-wrong);
  border-color: var(--bb-wrong);
}

.wq_quizCtr.listquiz_quiz .desc {
  font-size: 26px;
  text-shadow: 0 1px 4px rgba(0,0,0,.35);
  padding: 24px;
}

/* ════════════════════════════════════════════
   RETAKE БАТЫРМАСЫ
════════════════════════════════════════════ */
.wq_retakeQuizCtr {
  clear: both;
  text-align: center;
  padding: 8px 0 4px;
}

/* ════════════════════════════════════════════
   CHECKED ANSWERS LIST (trivia end)
════════════════════════════════════════════ */
.wq-checked-answers-list {
  margin-top: 20px;
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  overflow: hidden;
}

.wq-checked-answers-list__question {
  padding: 14px 16px;
  border-bottom: 1px solid var(--bb-border);
  background: var(--bb-white);
  margin: 0;
}

.wq-checked-answers-list__question:last-child {
  border-bottom: none;
}

.wq-checked-answers-list__question-title {
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 6px;
  color: var(--bb-black);
}

.wq-checked-answers-list__question-desc {
  font-size: 13px;
  color: var(--bb-gray-7);
  margin-top: 4px;
}

.wq-checked-answers-list .is-correct {
  color: var(--bb-correct);
}

.wq-checked-answers-list .is-incorrect {
  color: var(--bb-wrong);
}

/* ════════════════════════════════════════════
   ЖЫПЫЛЫҚТАУШЫ ЖҮКТЕЛУ
════════════════════════════════════════════ */
.wq-loading {
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(4px);
  border-radius: var(--bb-radius);
}

/* ════════════════════════════════════════════
   EMBED TOGGLE
════════════════════════════════════════════ */
.wq-embed {
  border-radius: var(--bb-radius);
  overflow: hidden;
  background: var(--bb-gray-1);
}

/* ════════════════════════════════════════════
   QUIZ LISTING (shortcode)
════════════════════════════════════════════ */
.wp-quiz-listing .latestPost {
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  overflow: hidden;
  box-shadow: var(--bb-shadow);
  transition: box-shadow var(--bb-trans);
}

.wp-quiz-listing .latestPost:hover {
  box-shadow: var(--bb-shadow-h);
}

.wp-quiz-listing .thecategory {
  background: var(--bb-accent);
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 8px;
}

/* ════════════════════════════════════════════
   SKIN: RESULTS CONTAINER (flat)
════════════════════════════════════════════ */
.wq-quiz.wq-skin-flat .wq-results {
  background: var(--bb-white);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  padding: 24px;
}

/* ════════════════════════════════════════════
   FB QUIZ
════════════════════════════════════════════ */
.wq-quiz-fb_quiz .wq-results {
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  background: var(--bb-white);
  padding: 20px;
}

/* ════════════════════════════════════════════
   ТРАДИЦИОННЫЙ CORRECT/WRONG BLOCKS
════════════════════════════════════════════ */
.wq-skin-traditional .wq_correctExplanationHead {
  color: var(--bb-correct);
  font-weight: 700;
  font-size: 15px;
}

.wq-skin-traditional .wq_wrongExplanationHead {
  color: var(--bb-wrong);
  font-weight: 700;
  font-size: 15px;
}

.wq-skin-traditional .wq_quizForceActionCtr {
  background: var(--bb-gray-1);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius);
  padding: 24px;
  margin: 20px 0 12px;
}

/* ════════════════════════════════════════════
   MOBILE RESPONSIVE
════════════════════════════════════════════ */
@media screen and (max-width: 600px) {
  .wq_quizCtr .wq-quiz.wq-skin-flat .wq_singleAnswerCtr,
  .wq-skin-traditional .wq_singleAnswerCtr {
    padding: 10px 14px;
  }

  body .wq_questionTextCtr {
    padding: 16px 16px 12px;
  }

  body .wq_questionTextCtr h4 {
    font-size: 16px;
  }

  .wq_questionAnswersCtr {
    padding: 12px 16px 16px;
  }

  .wq-quiz-fb_quiz .wq-results .wq_shareCtr,
  .wq-quiz-fb_quiz .wq-results .wq_resultDesc {
    padding: 0 16px 16px;
  }

  .wq_retakeQuizBtn,
  .wq_singleQuestionWrapper .wq_continue button {
    width: 100%;
    font-size: 15px;
    padding: 12px 20px;
  }

  .wq-quiz-personality .col-md-wq-4 {
    width: 100%;
    margin-right: 0;
  }

  .wq-quiz-swiper .wq-results.wq_IsSwiperResult {
    width: 100%;
  }

  .wq_triviaQuizTimerCtr {
    top: 70px;
    right: 12px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    font-size: 16px;
  }

  .wq_quizCtr .wq-results {
    padding: 16px;
  }

  .wq-subscribe-locker,
  .wq-quiz.wq-skin-flat .wq_quizForceActionCtr {
    padding: 16px;
  }

  .wq-swiper-actions {
    width: 100%;
    padding-top: 12px;
  }
}

@media screen and (max-width: 480px) {
  .wq-quiz-flip .wq-question .desc > div {
    font-size: 22px;
  }

  .wq_shareCtr {
    flex-direction: column;
  }

  .wq_shareCtr button,
  .wq_quizForceShareCtr button {
    width: 100%;
    justify-content: center;
  }
}