/* Скрий текстовете с математика, докато MathJax ги форматира */
html.mathjax-loading #exam-root .mathjax-pending{
  visibility: hidden;
}

html.mathjax-ready #exam-root .mathjax-pending{
  visibility: visible;
}.single-play-btn{
  background: #ffc107;          /* жълтото остава */
  color: #1a1a1a;               /* тъмен текст → висок контраст */
  border: none;
  border-radius: 999px;
  padding: 6px 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.15s ease;
}

/* hover */
.single-play-btn:hover{
  background: #ffca2c;
  color: #000;
}

/* active (натиснато) */
.single-play-btn:active{
  transform: scale(0.97);
}

/* disabled */
.single-play-btn:disabled{
  opacity: 0.6;
  cursor: not-allowed;
}

/* Номерът на въпроса */
#exam-root .question-number{
  font-size: 1.18rem !important;
  font-weight: 700 !important;
  color: #dbeafe !important;
  line-height: 1.35 !important;
  margin-top: 0 !important;
}

/* Десктоп / таблет – номерът е отстрани */
@media (min-width: 768px){
  #exam-root .question-wrapper{
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: .75rem !important;
  }

  #exam-root .question-number{
    min-width: 2.25rem !important;
    text-align: right !important;
    padding-top: .35rem !important;
    margin-bottom: 0 !important;
    flex: 0 0 2.25rem !important;
  }

  #exam-root .question-wrapper > .flex-grow-1{
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }
}

/* Телефон – номерът остава отгоре */
@media (max-width: 767.98px){
  #exam-root .question-wrapper{
    display: block !important;
  }

  #exam-root .question-number{
    display: block !important;
    text-align: left !important;
    margin-bottom: .35rem !important;
    padding-top: 0 !important;
  }
}


.section-wrapper {

  border-left: 4px solid #0d6efd;

  padding: 1rem 1rem 0.75rem;
  margin-bottom: 1.5rem;
  border-radius: 0.75rem;
}

.section-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.section-body {
  margin-top: 0.5rem;
}

  /* Таблици за задачата "Попълни таблицата" при ученика */
  .table-fill-student {
    border-collapse: separate;
    border-spacing: 0;
  }

  .table-fill-student th,
  .table-fill-student td {
    border-width: 1px;
    border-style: solid;
    border-color: rgba(148, 163, 184, 0.7); /* по-светло сиво в тъмен режим */
  }

  /* малко по-видими вертикални линии (дясна граница) */
  .table-fill-student td + td,
  .table-fill-student th + th {
    border-left-color: rgba(148, 163, 184, 0.9);
  }

  /* входните полета да личат повече като клетки */
  .table-fill-student input[type="text"] {
    background: rgba(15, 23, 42, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.9);
    border-radius: 4px;
    padding: 2px 4px;
    color: #e5e7eb;          /* светъл цвят на цифрите/текста */
    font-weight: 600;
  }

  .table-fill-student input[type="text"]::placeholder {
    color: rgba(148,163,184,0.8);
  }

/* ... твоите неща ... */

  /* Специално за таблицата „попълни“ при ученика */
  #exam-root .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* да гарантираме, че таблицата може да е по-широка от екрана */
  #exam-root table.table-fill-student {
    display: table;          /* презаписва мобилното table{display:block} */
    width: auto;             /* не я заковавай на 100%, остави я да расте */
    min-width: 600px;        /* или според това колко колони имаш */
    overflow: visible;
  }

/* MathJax inline формулите да не се пренасят */
.question-text mjx-container,
.question-text .MathJax {
  white-space: nowrap;
  display: inline-block;
  vertical-align: baseline !important;
  margin: 0 !important;
  transform: translateY(-0.02em);
  padding-botom:14px;
}
.code-editor {
  background:#1e1e1e;
  color:#f1f1f1;
  font-family: "Fira Code", Consolas, monospace;
  font-size: 14px;
}

/* 🔒 Воден знак през целия екран (тилове се повтарят) */
#wm{
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: .08;
  background-repeat: repeat;
  background-size: 320px 240px;
  mix-blend-mode: multiply;
}

/* входовете да са четими */
.cloze-input{
  display:inline-block;
  vertical-align:middle;
  min-width: 10ch;
  width: 16ch;
  max-width: 60%;
  padding: .4rem .6rem;
  border-radius: .6rem;

  text-align: left;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  direction: ltr;
  unicode-bidi: plaintext;
  caret-color: auto;

  scrollbar-width: none;
}

.cloze-input::-webkit-scrollbar{
  display: none;
}

/* ===== Crossword – fixed look + clickable clues ===== */

.cw-wrap{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}

@media (min-width: 992px){
  .cw-wrap{
    grid-template-columns:auto 1fr;
    align-items:start;
  }
}

.cw-grid-wrap{
  overflow:auto;
  padding:6px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.06);
}

.cw-grid{
  display:grid;
  gap:2px;
  width:max-content;
}

.cw-cell{
  position:relative;
  width:34px;
  height:34px;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.95);
  display:flex;
  align-items:center;
  justify-content:center;
}

.cw-cell.cw-block{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.08);
}

.cw-num{
  position:absolute;
  top:2px;
  left:4px;
  font-size:10px;
  line-height:1;
  color:#111;
  opacity:.75;
  z-index:2;
}

.cw-inp{
  width:100%;
  height:100%;
  border:none;
  outline:none;
  text-align:center;
  background:transparent;
  font-weight:700;
  font-size:18px;
  text-transform:uppercase;
  color:#111;
  caret-color:#111;
  padding:0;
}

.cw-inp{
  width:100%;
  height:100%;
  border:none;
  outline:none;
  text-align:center;
  background:transparent;
  font-weight:700;
  font-size:18px;
  text-transform:uppercase;
  color:#111;
  caret-color:#111;
  padding:0;
}

.cw-cell:has(.cw-inp:focus){
  background:#fbbf24 !important;
  border-color:#d97706 !important;
  box-shadow:0 0 0 3px rgba(251,191,36,.45) !important;
}

.cw-inp:focus,
.cw-inp:focus-visible{
  background:transparent !important;
  outline:none !important;
}

.cw-clues{
  display:grid;
  gap:12px;
}

.cw-clue-box{
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  padding:10px 12px;
  background:rgba(255,255,255,.08);
}

.cw-clue-title{
  font-weight:700;
  margin-bottom:6px;
  color:#f3f4f6;
}

.cw-clue-list{
  display:grid;
  gap:6px;
}

.cw-clue{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:4px 0;
  cursor:pointer;
  border-radius:8px;
  color:#e5e7eb;
}

.cw-clue:hover{
  background:rgba(255,255,255,.06);
}

.cw-clue:focus,
.cw-clue:focus-visible{
  outline:2px solid rgba(147,197,253,.85);
  outline-offset:2px;
}

.cw-no{
  min-width:26px;
  font-weight:700;
  opacity:.95;
  color:#93c5fd;
  flex:0 0 26px;
}

.cw-text{
  line-height:1.4;
  color:#e5e7eb;
  flex:1 1 auto;
}

.cw-hint-btn{
  margin-left:8px;
  border:none;
  border-radius:6px;
  padding:2px 6px;
  cursor:pointer;
  background:rgba(255,255,255,.14);
  color:#fff;
  flex:0 0 auto;
}

.cw-hint-btn.is-used{
  opacity:.4;
  cursor:not-allowed;
}

.cw-inp.cw-revealed{
  font-weight:800;
  text-decoration:underline;
}

@media (max-width: 576px){
  .cw-cell{
    width:30px;
    height:30px;
  }

  .cw-inp{
    font-size:16px;
  }

  .cw-num{
    font-size:9px;
  }
}

@media (max-width: 576px){
  .cw-cell{
    width:30px;
    height:30px;
  }

  .cw-inp{
    font-size:16px;
  }

  .cw-num{
    font-size:9px;
  }
}
.cloze-input:focus{ box-shadow: 0 0 0 .2rem rgba(13,110,253,.25); outline: 0; }
.cloze-block{ line-height: 1.8; }
@media (max-width: 576px){
  .cloze-input{ display:block; width:100%; max-width:100%; margin:.35rem 0 .6rem; }
}

/* Match (pairs) */
.match-pairs { display: grid; gap: 12px; }
.match-head  { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; font-size: .9rem; color: #adb5bd; }
.pair-row    { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: center; }
.pair-left   { font-weight: 500; line-height: 1.4; }
.pair-right select { width: 100%; min-height: 44px; font-size: 16px; }
@media (max-width: 576px){
  .match-head { display: none; }
  .pair-row { grid-template-columns: 1fr; }
  .pair-left { margin-bottom: 4px; }
}

.question-wrapper { display:flex; align-items:flex-start; gap:.75rem; }
.question-number {
  font-size:1.05rem;
  color:#e0e0e0;
  min-width:2rem;
  text-align:right;
  margin-top:0;
  line-height:1.35;
}

/* Въздух вътре в картите */
.card.question-card>.card-body{ padding:6px 16px 10px 16px !important; }
.card.question-card>.card-body>:first-child{ margin-top:0 !important; }
.card.question-card p.mb-1{ margin:0 !important; line-height:1.45; display:block; }
.card.question-card .d-flex.align-items-start{ align-items:flex-start !important; }
.card.question-card .badge{ line-height:1; padding:3px 8px; }

/* Забрана за селекция/копиране (фиксирано !important) */
.no-copy, .no-copy *{ user-select:none !important; -webkit-touch-callout:none !important; }
.no-copy input, .no-copy textarea, .no-copy select,
.no-copy .allow-select, .no-copy .allow-select *{
  user-select:text !important; -webkit-touch-callout:default !important;
}
.no-copy img, .no-copy svg{ -webkit-user-drag:none; user-drag:none; }

.question-text { word-wrap: break-word;font-size:1.5rem!important; }
.question-text .formula-nowrap, .question-text code{ white-space:nowrap; display:inline-block; }

@media (max-width: 576px){
  /* контейнерът на таблицата да си е scroll контейнер */
  #exam-root .table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* самата таблица да може да е по-широка */
  #exam-root .table-responsive > table,
  #exam-root table.table-fill-student {
    display: table !important;
    width: auto !important;
    min-width: 600px !important;   /* може и 700/800 – според задачата */
    max-width: none !important;
  }

  /* за всеки случай – да не я маскира нищо */
  #exam-root .table {
    overflow: visible !important;
  }
}

.question-card{ margin-top:0 !important; padding-top:0 !important; }
      .card-body{ padding-top:0 !important; }
      #timerBar.timer-fixed{
        position:fixed; right:0; top:120px; width:220px; z-index:1050;
        box-shadow:0 10px 25px rgba(0,0,0,.15);
      }
     #timerBar.timer-fixed {
    position: fixed;
    right: 0;
    top: 120px;
    width: 110px;
    z-index: 1050;
    display: flex;
    flex-direction: column; /* ключовото */
    gap: 10px;
    padding: 16px 20px;
    border-radius: 14px;
    background-color: #FFE082;
    color: #2b2b2b;
    font-family: "Segoe UI", sans-serif;
    box-shadow: 0 10px 25px rgba(0,0,0,.15);
}
      .timer-left { display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
      .timer-left .label { font-weight:600; font-size:1rem; color:#4E342E; line-height:1.2; }
      .timer-left .time { font-size:1.9rem; font-weight:700; color:#000; }
      .timer-right { flex:1; padding-left:10px; }
      .timer-right .note { font-size:.65rem; line-height:1.45; color:#3E2723; }
      .timer-img {
        width:80px; height:80px; object-fit:cover; border-radius:50%;
        border:2px solid rgba(255,255,255,0.6); box-shadow:0 2px 6px rgba(0,0,0,0.2);
      }
      @media (max-width: 991.98px) {
        #timerBar.timer-fixed { position:static; width:auto; margin-bottom:1rem; box-shadow:none; }
        .timer-img { display:none; }
      }
      .choice-pre{ display:inline-block; white-space:pre-wrap; font-family:inherit; line-height:1.4; margin:0; padding:0; }

/* Контейнерът, който реално ще скролва наляво/надясно */
  #exam-root .exam-table-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  /* Самата таблица – да може да е по-широка от екрана */
  #exam-root .exam-table-inner {
    display: table;
    width: auto;
    min-width: 700px;          /* ако имаш много колони – увеличи, напр. 900px */
    max-width: none;
  }

  /* Да сме сигурни, че нищо не я реже */
  #exam-root .exam-table-inner,
  #exam-root .exam-table-inner td,
  #exam-root .exam-table-inner th {
    overflow: visible !important;
    white-space: nowrap;       /* по желание – да не се чупи текст на няколко реда */
  }

  /* Ако глобално имаш .table { overflow:hidden; } – бием го тук */
  #exam-root .table {
    overflow: visible !important;
  }


#exam-root .card.question-card {
    display: block !important;
}
#exam-root .exam-table-wrap {
    width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

#exam-root .exam-table-inner {
    display: table !important;
    width: auto !important;
    min-width: 700px !important;
}

/* за всеки случай – в рамките на изпита така: */
  #exam-root .table {
    overflow: visible !important;
  }

  #exam-root .exam-table-wrap {
    scrollbar-width: thin;               /* Firefox */
  }

.ann-wrap{position:relative;display:inline-block;max-width:100%;}
    .ann-pin{
      position:absolute; width:18px; height:18px; border-radius:50%;
      border:2px solid #fff; transform:translate(-50%,-50%); cursor:pointer;
      box-shadow:0 2px 6px rgba(0,0,0,.35);
    }
    .ann-note{
      position:absolute; transform:translate(-50%,0);
      background:rgba(0,0,0,.75); color:#fff; font-size:.8rem;
      padding:.25rem .4rem; border-radius:.35rem; max-width:220px; white-space:normal;
    }

    /* малък диалог за въвеждане/редакция на коментара */
    .ann-dialog-backdrop{
      position:fixed; inset:0; z-index:30000;
      background:rgba(0,0,0,.55);
      display:none; align-items:center; justify-content:center;
    }
    .ann-dialog{
      background:#fff; color:#222; padding:12px 14px;
      border-radius:10px; max-width:360px; width:90%;
      box-shadow:0 10px 24px rgba(0,0,0,.35);
    }
    .ann-dialog textarea{
      width:100%; min-height:80px; resize:vertical;
    }

#fs-lock{
    position:fixed; inset:0; z-index:20000; display:none;
    align-items:center; justify-content:center;
    background:rgba(0,0,0,.65); backdrop-filter:blur(2px);
  }
  #fs-card{
    background:#fff; color:#222; border-radius:14px; padding:18px 20px; max-width:560px;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
  }
  #fs-card h3{ margin:0 0 .45rem; font-size:1.1rem; }
  @media print { html, body, #exam-root { display:none !important; } }

@media print {
    html, body, #exam-root { display: none !important; }
  }
  /* ===== Вграден бутон за смяна на клавиатура (EN/BG) ===== */
.kbd-widget{position:fixed; right:16px; bottom:16px; z-index:10050; display:flex; gap:8px; align-items:center;}
.kbd-widget .kbd-btn{display:inline-flex; align-items:center; justify-content:center; min-width:54px; height:38px; padding:0 12px; border-radius:999px; border:1px solid rgba(0,0,0,.15); background:rgba(255,255,255,.92); box-shadow:0 6px 18px rgba(0,0,0,.15); font-weight:700; letter-spacing:.02em; user-select:none;}
.kbd-widget .kbd-btn:active{transform:translateY(1px);}
.kbd-widget .kbd-hint{font-size:12px; opacity:.8; background:rgba(0,0,0,.55); color:#fff; padding:6px 10px; border-radius:12px; display:none; max-width:260px;}
.kbd-widget.kbd-show-hint .kbd-hint{display:block;}
/* ✅ На телефон бутонът EN/ФОН/БДС е напълно скрит */
@media (max-width: 767.98px), (max-width: 900px) and (pointer: coarse){
  .kbd-widget{
    display:none !important;
  }
  .kbd-widget .kbd-hint{
    display:none !important;
  }
}
/* Fix: бял текст на бяло при kbd бутона */
.kbd-widget .kbd-btn{
  color:#111 !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(0,0,0,.18) !important;
}
.kbd-widget .kbd-btn:hover{
  background:rgba(255,255,255,1) !important;
}
.swal2-popup.swal2-toast{
  background:rgba(15,15,18,.95) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.12) !important;
}
.swal2-popup.swal2-toast .swal2-title,
.swal2-popup.swal2-toast .swal2-html-container{
  color:#fff !important;
}
.cw-clues{
  background:#1f2937;
  color:#042361;
}

.cw-clues *{
  color:#e9e9e9;
}
/* =========================
   SUBMIT BUTTON – STUDENT FRIENDLY
   ========================= */

#submitExamBtn,
button[form="examForm"]{
  min-height: 56px !important;
  padding: .9rem 1.6rem !important;
  border-radius: 16px !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: .01em !important;
  border: 0 !important;

  background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(37,99,235,.28) !important;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease !important;
}

#submitExamBtn:hover,
button[form="examForm"]:hover{
  transform: translateY(-1px) !important;
  filter: brightness(1.05) !important;
  box-shadow: 0 14px 28px rgba(37,99,235,.34) !important;
}

#submitExamBtn:active,
button[form="examForm"]:active{
  transform: translateY(0) scale(.99) !important;
  box-shadow: 0 8px 18px rgba(37,99,235,.24) !important;
}

#submitExamBtn:focus,
#submitExamBtn:focus-visible,
button[form="examForm"]:focus,
button[form="examForm"]:focus-visible{
  outline: 3px solid rgba(147,197,253,.85) !important;
  outline-offset: 3px !important;
}

/* контейнерът на бутона */
#submitWrap{
  margin-top: 1.2rem !important;
  padding-top: .35rem !important;
}

/* по-голям на телефон */
@media (max-width: 576px){
  #submitExamBtn,
  button[form="examForm"]{
    width: 100% !important;
    min-height: 58px !important;
    font-size: 1.08rem !important;
    border-radius: 14px !important;
  }

  #submitWrap{
    position: sticky;
    bottom: 10px;
    z-index: 50;
    background: linear-gradient(to top, rgba(2,6,23,.95), rgba(2,6,23,0));
    padding-top: .8rem !important;
    padding-bottom: .2rem !important;
  }
}
/* =========================
   REAL SPACE BETWEEN QUESTIONS
   ========================= */

#exam-root .question-wrapper{
  margin-bottom: 1.65rem !important;
}

#exam-root .question-wrapper:last-of-type{
  margin-bottom: 0 !important;
}

/* самата карта да няма собствен външен margin,
   за да не се бие с wrapper spacing */
#exam-root .card.question-card{
  margin-bottom: 0 !important;
}

/* вътрешен въздух */
#exam-root .card.question-card > .card-body{
  padding-top: .9rem !important;
  padding-bottom: 1rem !important;
}

/* още една идея въздух между номер и следващ въпрос на mobile */
@media (max-width: 576px){
  #exam-root .question-wrapper{
    margin-bottom: 1.15rem !important;
  }

  #exam-root .card.question-card > .card-body{
    padding-top: .8rem !important;
    padding-bottom: .9rem !important;
  }
}
/* =========================
   HELPER TEXT UNDER QUESTION
   ========================= */

#exam-root .question-card .text-muted.small,
#exam-root .question-card .text-muted.mb-1,
#exam-root .question-card .small.text-muted{
  display: inline-block !important;
  margin: .35rem 0 .8rem 0 !important;
  padding: .45rem .7rem !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.10) !important;

  color: #dbeafe !important;
  font-size: .98rem !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
}
#exam-root .question-card[data-qtype="mcq_multi"] .text-muted.small,
#exam-root .question-card[data-qtype="mcq_multi"] .text-muted.mb-1,
#exam-root .question-card[data-qtype="mcq_multi"] .small.text-muted{
  background: rgba(59,130,246,.12) !important;
  border-color: rgba(96,165,250,.28) !important;
  color: #eff6ff !important;
}
#mobile-strict-lock{
  position:fixed;
  inset:0;
  z-index:21000;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.68);
  backdrop-filter:blur(2px);
}

#mobile-strict-card{
  background:#fff;
  color:#222;
  border-radius:14px;
  padding:18px 20px;
  width:min(92vw, 520px);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}

#mobile-strict-card h3{
  margin:0 0 .45rem;
  font-size:1.1rem;
}
#exam-root .form-check-label{
  align-items: center !important;
}

#exam-root .form-check-label .choice-text{
  display: flex;
  align-items: center;
}

#exam-root .form-check-label .choice-text mjx-container,
#exam-root .form-check-label .choice-text .MathJax{
  display: inline-block !important;
  vertical-align: middle !important;
  margin: 0 !important;
}
.question-pager{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  position:sticky;
  top:10px;
  z-index:40;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
  border:1px solid rgba(0,0,0,.08);
}

.question-pager-left{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
}

.question-pager-mid{
  flex:1 1 auto;
}

.question-pager-line{
  width:100%;
  height:4px;
  background:#d9dcef;
  border-radius:999px;
  overflow:hidden;
}

#questionPagerBar{
  height:100%;
  width:0%;
  background:#9fa8da;
  border-radius:999px;
  transition:width .2s ease;
}

.question-pager-right{
  flex:0 0 auto;
  white-space:nowrap;
  color:#4b5563;
  font-weight:600;
}

@media (max-width: 768px){
  .question-pager{
    flex-wrap:wrap;
  }
  .question-pager-mid{
    order:3;
    width:100%;
    flex-basis:100%;
  }
}
  #exam-root .question-wrapper.pager-hidden,
  #exam-root .section-wrapper.pager-hidden,
  #exam-root .mt-3.pager-hidden{
    display: none !important;
  }
    #exam-root .question-wrapper.pager-hidden,
  #exam-root .section-wrapper.pager-hidden,
  #exam-root .mt-3.pager-hidden,
  #exam-root #practicalBody.pager-hidden{
    display: none !important;
  }
  /* Предварително скриване при режим "1 въпрос на екран",
   за да няма премигване на всички въпроси при първоначален render */
#exam-root.pager-init-hide .question-wrapper,
#exam-root.pager-init-hide .section-wrapper,
#exam-root.pager-init-hide #quizSubmitWrap,
#exam-root.pager-init-hide #practicalBody,
#exam-root.pager-init-hide #practicalSubmitWrap{
  display: none !important;
}
  .practical-instruction{
  white-space: pre-wrap;
  line-height: 1.45;
  margin: 0;
  padding-left: 0;
  text-indent: 0;
}

.practical-instruction p{
  margin: 0 0 .45rem 0;
  text-indent: 0;
}

.practical-instruction ul,
.practical-instruction ol{
  margin: .35rem 0 .35rem 1.1rem;
  padding-left: 0.7rem;
}

.practical-instruction li{
  margin: .15rem 0;
}
.practical-instruction{
  white-space: pre-wrap;
  line-height: 1.45;
  margin: 0;
  padding: 0;
  text-indent: 0;
}
.exam-description{
  white-space: pre-line;
  line-height: 1.5;
  text-indent: 0;
}

/* =========================================================
   LIGHT THEME – EXAM TAKE UI (11/10 student friendly)
   Работи само когато #exam-root има class .exam-light-ui
   ========================================================= */

#exam-root.exam-light-ui{
  max-width: 1100px;
  margin: 0 auto;
  padding-bottom: 2rem;
}

/* Общ фон и ритъм */
#exam-root.exam-light-ui{
  color: #0f172a !important;
}

#exam-root.exam-light-ui h2{
  font-size: 2rem;
  font-weight: 800;
  line-height: 1.2;
  color: #0f172a !important;
  margin-bottom: 1rem !important;
}

#exam-root.exam-light-ui h4{
  font-size: 1.18rem;
  font-weight: 800;
  color: #1e293b !important;
  margin-bottom: 1rem !important;
}

/* Описание на теста */
#exam-root.exam-light-ui > .card.mb-3{
  border: 1px solid #dbe4f0 !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
}

#exam-root.exam-light-ui .exam-description{
  color: #334155 !important;
  font-size: 1rem;
  line-height: 1.65;
  padding: 1rem 1.1rem !important;
}

/* Въпрос – layout */
#exam-root.exam-light-ui .question-wrapper{
  align-items: stretch !important;
  gap: 1rem !important;
  margin-bottom: 1.35rem !important;
}

/* Номер на въпроса – като badge */
#exam-root.exam-light-ui .question-number,
#exam-root.exam-light-ui .question-number.text-light{
  color: #1d4ed8 !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  min-width: 2.4rem !important;
  height: 2.4rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%) !important;
  border: 1px solid #bfdbfe !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 4px 10px rgba(37,99,235,.10) !important;
  text-align: center !important;
  margin-top: .25rem !important;
  padding: 0 !important;
}

/* Самата карта на въпроса */
#exam-root.exam-light-ui .card.question-card{
  border: 1px solid #dbe4f0 !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06) !important;
  overflow: hidden;
}

#exam-root.exam-light-ui .card.question-card > .card-body{
  padding: 1rem 1.1rem 1.1rem 1.1rem !important;
}

/* Текст на въпроса */
#exam-root.exam-light-ui .question-text{
  color: #0f172a !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;
  margin-bottom: .4rem !important;
}

/* Точките */
#exam-root.exam-light-ui .badge.bg-light.text-muted,
#exam-root.exam-light-ui .badge.bg-light{
  background: #eef4ff !important;
  color: #1e40af !important;
  border: 1px solid #c7dbff !important;
  border-radius: 999px !important;
  font-size: .8rem !important;
  font-weight: 800 !important;
  padding: .38rem .65rem !important;
  box-shadow: none !important;
}

/* Helper text */
#exam-root.exam-light-ui .question-helper-text,
#exam-root.exam-light-ui .question-card .text-muted.small,
#exam-root.exam-light-ui .question-card .text-muted.mb-1,
#exam-root.exam-light-ui .question-card .small.text-muted{
  display: inline-flex !important;
  align-items: center !important;
  gap: .45rem !important;
  background: #f8fbff !important;
  color: #334155 !important;
  border: 1px solid #d9e8ff !important;
  border-radius: 12px !important;
  padding: .55rem .8rem !important;
  font-size: .93rem !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  margin: .45rem 0 .85rem 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95) !important;
}

/* Отговорите – редове */
#exam-root.exam-light-ui .form-check{
  margin-bottom: .55rem !important;
  padding: .72rem .85rem !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .12s ease !important;
}

#exam-root.exam-light-ui .form-check:hover{
  background: #f8fbff !important;
  border-color: #bfdbfe !important;
  box-shadow: 0 6px 16px rgba(59,130,246,.08) !important;
  transform: translateY(-1px);
}

#exam-root.exam-light-ui .form-check:has(.form-check-input:checked){
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 8px 20px rgba(37,99,235,.10) !important;
}

#exam-root.exam-light-ui .form-check-input{
  width: 1.05rem !important;
  height: 1.05rem !important;
  margin-top: 0 !important;
  border-color: #94a3b8 !important;
  background-color: #ffffff !important;
}

#exam-root.exam-light-ui .form-check-input:checked{
  background-color: #2563eb !important;
  border-color: #2563eb !important;
}

#exam-root.exam-light-ui .form-check-label{
  color: #0f172a !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
  cursor: pointer;
}

/* Input / select / textarea */
#exam-root.exam-light-ui .form-control,
#exam-root.exam-light-ui .form-select,
#exam-root.exam-light-ui textarea,
#exam-root.exam-light-ui input[type="text"],
#exam-root.exam-light-ui input[type="number"]{
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.03) !important;
}

#exam-root.exam-light-ui .form-control:focus,
#exam-root.exam-light-ui .form-select:focus,
#exam-root.exam-light-ui textarea:focus,
#exam-root.exam-light-ui input[type="text"]:focus,
#exam-root.exam-light-ui input[type="number"]:focus{
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 4px rgba(96,165,250,.18) !important;
}

/* Cloze inputs */
#exam-root.exam-light-ui .cloze-input{
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 12px !important;
  min-height: 42px;
}

/* Matching / pairing / таблици */
#exam-root.exam-light-ui .table-fill-student,
#exam-root.exam-light-ui .exam-table-inner{
  background: #ffffff !important;
}

#exam-root.exam-light-ui .table-fill-student th,
#exam-root.exam-light-ui .table-fill-student td,
#exam-root.exam-light-ui .exam-table-inner th,
#exam-root.exam-light-ui .exam-table-inner td{
  border-color: #d5deea !important;
  color: #0f172a !important;
}

#exam-root.exam-light-ui .table-fill-student th,
#exam-root.exam-light-ui .exam-table-inner th{
  background: #f8fbff !important;
  font-weight: 800 !important;
}

/* Секциите с passage */
#exam-root.exam-light-ui .section-wrapper{
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%) !important;
  border: 1px solid #d9e8ff !important;
  border-left: 5px solid #3b82f6 !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.04) !important;
  padding: 1rem 1rem .75rem !important;
}

#exam-root.exam-light-ui .section-label{
  color: #475569 !important;
  font-size: .78rem !important;
}

#exam-root.exam-light-ui .section-label .badge{
  font-weight: 800 !important;
}

/* Pager */
#exam-root.exam-light-ui .question-pager{
  background: rgba(255,255,255,.92) !important;
  border: 1px solid #dbe4f0 !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.08) !important;
  backdrop-filter: blur(12px);
  top: 12px !important;
}

#exam-root.exam-light-ui .question-pager-line{
  height: 8px !important;
  background: #e5edff !important;
}

#exam-root.exam-light-ui #questionPagerBar{
  background: linear-gradient(90deg, #60a5fa, #2563eb) !important;
}

#exam-root.exam-light-ui .question-pager-right{
  color: #334155 !important;
  font-weight: 800 !important;
}

/* Timer */
#exam-root.exam-light-ui #timerBar.timer-fixed{
  background: linear-gradient(180deg, #fff7d6 0%, #ffe79d 100%) !important;
  border: 1px solid #f3d36b !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 32px rgba(180, 120, 0, 0.18) !important;
}

#exam-root.exam-light-ui .timer-left .label{
  color: #7c4a03 !important;
}

#exam-root.exam-light-ui .timer-left .time{
  color: #111827 !important;
}

#exam-root.exam-light-ui .timer-right .note{
  color: #6b4f00 !important;
}

/* Submit бутон wrap на mobile да не е тъмен */
@media (max-width: 576px){
  #exam-root.exam-light-ui #submitWrap{
    background: linear-gradient(to top, rgba(248,250,252,.96), rgba(248,250,252,0)) !important;
  }
}

/* Crossword – светла тема */
#exam-root.exam-light-ui .cw-grid-wrap,
#exam-root.exam-light-ui .crossword-student .cw-grid-wrap{
  background: #f8fbff !important;
  border: 1px solid #d6e2f0 !important;
  border-radius: 16px !important;
}

#exam-root.exam-light-ui .cw-cell,
#exam-root.exam-light-ui .crossword-student .cw-cell{
  background: #ffffff !important;
  border: 1px solid #94a3b8 !important;
  border-radius: 8px !important;
}

#exam-root.exam-light-ui .cw-cell.cw-block,
#exam-root.exam-light-ui .crossword-student .cw-cell.cw-block{
  background: #dbe3ee !important;
  border-color: #c5d0dd !important;
}

#exam-root.exam-light-ui .cw-num,
#exam-root.exam-light-ui .crossword-student .cw-num{
  color: #0f172a !important;
  opacity: 1 !important;
}

#exam-root.exam-light-ui .cw-inp,
#exam-root.exam-light-ui .crossword-student .cw-inp{
  color: #0f172a !important;
  caret-color: #0f172a !important;
  background: transparent !important;
}

#exam-root.exam-light-ui .cw-cell:has(.cw-inp:focus),
#exam-root.exam-light-ui .crossword-student .cw-cell:has(.cw-inp:focus){
  outline: 3px solid rgba(96,165,250,.24) !important;
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 4px rgba(96,165,250,.14) !important;
}

#exam-root.exam-light-ui .cw-clues,
#exam-root.exam-light-ui .crossword-student .cw-clues{
  background: #ffffff !important;
  border: 1px solid #d6e2f0 !important;
  border-radius: 16px !important;
  color: #0f172a !important;
}

#exam-root.exam-light-ui .cw-clues *,
#exam-root.exam-light-ui .crossword-student .cw-clues *{
  color: #0f172a !important;
}

#exam-root.exam-light-ui .cw-clue-box,
#exam-root.exam-light-ui .crossword-student .cw-clue-box{
  background: #f8fbff !important;
  border: 1px solid #d9e8ff !important;
  border-radius: 14px !important;
}

#exam-root.exam-light-ui .cw-clue-title,
#exam-root.exam-light-ui .crossword-student .cw-clue-title{
  color: #1e3a8a !important;
  font-weight: 800 !important;
}

#exam-root.exam-light-ui .cw-clue,
#exam-root.exam-light-ui .crossword-student .cw-clue{
  background: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
}

#exam-root.exam-light-ui .cw-clue:hover,
#exam-root.exam-light-ui .crossword-student .cw-clue:hover{
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}

#exam-root.exam-light-ui .cw-no,
#exam-root.exam-light-ui .crossword-student .cw-no{
  color: #2563eb !important;
  font-weight: 800 !important;
}

#exam-root.exam-light-ui .cw-text,
#exam-root.exam-light-ui .crossword-student .cw-text{
  color: #334155 !important;
}

/* По-добър mobile spacing */
@media (max-width: 767.98px){
  #exam-root.exam-light-ui .question-wrapper{
    gap: .55rem !important;
  }

  #exam-root.exam-light-ui .question-number{
    width: 2.15rem !important;
    height: 2.15rem !important;
    font-size: .95rem !important;
    margin-bottom: .25rem !important;
  }

  #exam-root.exam-light-ui .card.question-card{
    border-radius: 16px !important;
  }

  #exam-root.exam-light-ui .question-text{
    font-size: 1.02rem !important;
  }

  #exam-root.exam-light-ui .form-check{
    padding: .78rem .78rem !important;
    border-radius: 12px !important;
  }
}
/* Скрий текстовете с математика, докато MathJax ги форматира */
/* =========================================================
   MOBILE HINT: хоризонтално плъзгане на "Попълни таблицата"
   ========================================================= */

.mobile-table-scroll-hint {
  display: none;
  width: 100%;
  align-items: center;
  gap: 10px;

  margin: 0 0 9px;
  padding: 10px 12px;

  border: 1px solid rgba(96, 165, 250, 0.42);
  border-radius: 12px;

  background: rgba(37, 99, 235, 0.14);
  color: #dbeafe;

  font-size: 0.9rem;
  line-height: 1.35;
}

.mobile-table-scroll-hint strong {
  color: inherit;
  font-weight: 800;
}

.mobile-table-scroll-hint-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;

  width: 34px;
  height: 34px;

  border-radius: 999px;

  background: rgba(59, 130, 246, 0.22);
  color: #ffffff;

  font-size: 1.2rem;
  font-weight: 900;
  line-height: 1;

  animation: mobile-table-hint-move 1.35s
    ease-in-out infinite;
}

/*
 * След като ученикът вече е плъзнал таблицата,
 * спираме анимацията, за да не го разсейва.
 */
.mobile-table-scroll-hint.has-scrolled
.mobile-table-scroll-hint-icon {
  animation: none;
}

/* Светъл режим */
#exam-root.exam-light-ui
.mobile-table-scroll-hint {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1e3a8a;
}

#exam-root.exam-light-ui
.mobile-table-scroll-hint-icon {
  background: #dbeafe;
  color: #1d4ed8;
}

@keyframes mobile-table-hint-move {
  0%,
  100% {
    transform: translateX(0);
  }

  40% {
    transform: translateX(4px);
  }

  70% {
    transform: translateX(-4px);
  }
}

@media (max-width: 767.98px) {
  .mobile-table-scroll-hint.is-visible {
    display: flex;
  }
}

/* На компютър съобщението никога не се показва */
@media (min-width: 768px) {
  .mobile-table-scroll-hint {
    display: none !important;
  }
}

/* Не трябва да присъства в принтирани материали */
@media print {
  .mobile-table-scroll-hint {
    display: none !important;
  }
}

/* Без анимация при включено системно ограничение */
@media (prefers-reduced-motion: reduce) {
  .mobile-table-scroll-hint-icon {
    animation: none !important;
  }
}
/* =========================================
   ЗНАЙКО – По-големи математически дроби
   Само в ученическия изглед на изпита
========================================= */

/* ==========================================
   ЗНАЙКО – ПО-ЕДРИ ДРОБИ В ИЗПИТА
   Само формули, които съдържат дроб
========================================== */

/* MathJax CommonHTML */
#exam-root .question-text mjx-container:has(mjx-mfrac),
#exam-root .choice-text mjx-container:has(mjx-mfrac),
#exam-root .form-check-label mjx-container:has(mjx-mfrac) {
    font-size: 1.55em !important;
    vertical-align: middle !important;
    margin: 0 0.08em !important;
}

/* MathJax SVG */
#exam-root .question-text mjx-container:has(g[data-mml-node="mfrac"]),
#exam-root .choice-text mjx-container:has(g[data-mml-node="mfrac"]),
#exam-root .form-check-label mjx-container:has(g[data-mml-node="mfrac"]) {
    font-size: 1.55em !important;
    vertical-align: middle !important;
    margin: 0 0.08em !important;
}