/**
 * IELTS Exam Options Overlay & Universal High Contrast / Text Size Styling
 */

/* ==========================================================================
   OPTIONS OVERLAY MODAL (Isolated White Specs Container)
   ========================================================================== */

/* Overlay Container */
#ielts-options-overlay,
.ielts-options-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: #ffffff !important;
    z-index: 999999 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    color: #111827 !important;
}

/* Top Bar */
.ielts-options-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 32px !important;
    height: 64px !important;
    border-bottom: 1px solid #e5e7eb !important;
    background-color: #ffffff !important;
    flex-shrink: 0;
}

.ielts-options-topbar__left,
.ielts-options-topbar__right {
    width: 120px !important;
    display: flex !important;
    align-items: center !important;
}

.ielts-options-topbar__right {
    justify-content: flex-end !important;
}

.ielts-options-topbar__center {
    flex: 1 !important;
    text-align: center !important;
}

.ielts-options-title {
    margin: 0 !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #111827 !important;
}

.ielts-options-back-btn {
    background: none !important;
    border: none !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #111827 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 !important;
}

.ielts-options-back-btn:hover {
    color: #374151 !important;
}

.ielts-options-close-btn {
    background: none !important;
    border: none !important;
    font-size: 28px !important;
    font-weight: bold !important;
    color: #111827 !important;
    cursor: pointer !important;
    line-height: 1 !important;
    padding: 0 !important;
}

.ielts-options-close-btn:hover {
    color: #4b5563 !important;
}

/* Content Body */
.ielts-options-content {
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 60px 20px !important;
    background-color: #ffffff !important;
}

.ielts-options-view {
    width: 100% !important;
    max-width: 520px !important;
}

/* Card Container */
.ielts-options-card {
    background-color: #ffffff !important;
    border: 1px solid #d1d5db !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}

/* Red Submit Button Row */
.ielts-options-btn-submit {
    width: 100% !important;
    background-color: #e31837 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 16px 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background-color 0.2s !important;
    text-align: left !important;
}

.ielts-options-btn-submit:hover {
    background-color: #c9132e !important;
}

.ielts-options-btn-submit__left {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    color: #ffffff !important;
}

.ielts-options-btn-submit__left i,
.ielts-options-btn-submit__left span,
.ielts-options-btn-submit i {
    font-size: 16px !important;
    color: #ffffff !important;
}

/* Standard Nav Row */
.ielts-options-row {
    width: 100% !important;
    background-color: #ffffff !important;
    border-top: 1px solid #e5e7eb !important;
    padding: 16px 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #111827 !important;
    cursor: pointer !important;
    transition: background-color 0.15s !important;
}

.ielts-options-row:hover {
    background-color: #f9fafb !important;
}

.ielts-options-row__left {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    color: #111827 !important;
}

.ielts-options-row__left span {
    color: #111827 !important;
}

.ielts-options-row__left i,
.ielts-options-row i {
    font-size: 16px !important;
    color: #111827 !important;
    width: 20px !important;
    text-align: center !important;
}

/* Selection Item Row */
.ielts-options-item {
    width: 100% !important;
    background-color: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding: 16px 20px !important;
    display: flex !important;
    align-items: center !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #111827 !important;
    cursor: pointer !important;
    transition: background-color 0.15s !important;
}

.ielts-options-item:last-child {
    border-bottom: none !important;
}

.ielts-options-item:hover {
    background-color: #f9fafb !important;
}

.ielts-options-item__check {
    width: 32px !important;
    font-size: 18px !important;
    font-weight: bold !important;
    color: #111827 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.ielts-options-item__check i {
    visibility: hidden !important;
    color: #111827 !important;
}

.ielts-options-item.-selected .ielts-options-item__check i {
    visibility: visible !important;
}

.ielts-options-item__label {
    flex: 1 !important;
    color: #111827 !important;
}

/* Contrast Preview Thumbnail Box */
.ielts-options-item__preview {
    width: 48px !important;
    height: 32px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 2px !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 4px !important;
    gap: 3px !important;
}

.ielts-options-item__preview span {
    display: block !important;
    height: 3px !important;
    border-radius: 1px !important;
}

.ielts-options-item__preview.-black-on-white {
    background-color: #ffffff !important;
}
.ielts-options-item__preview.-black-on-white span:first-child {
    background-color: #000000 !important;
    width: 100% !important;
    height: 5px !important;
}
.ielts-options-item__preview.-black-on-white span:nth-child(2),
.ielts-options-item__preview.-black-on-white span:nth-child(3) {
    background-color: #000000 !important;
    width: 80% !important;
}

.ielts-options-item__preview.-white-on-black {
    background-color: #000000 !important;
    border-color: #000000 !important;
}
.ielts-options-item__preview.-white-on-black span:first-child {
    background-color: #ffffff !important;
    width: 100% !important;
    height: 5px !important;
}
.ielts-options-item__preview.-white-on-black span:nth-child(2),
.ielts-options-item__preview.-white-on-black span:nth-child(3) {
    background-color: #ffffff !important;
    width: 80% !important;
}

.ielts-options-item__preview.-yellow-on-black {
    background-color: #000000 !important;
    border-color: #000000 !important;
}
.ielts-options-item__preview.-yellow-on-black span:first-child {
    background-color: #ffff00 !important;
    width: 100% !important;
    height: 5px !important;
}
.ielts-options-item__preview.-yellow-on-black span:nth-child(2),
.ielts-options-item__preview.-yellow-on-black span:nth-child(3) {
    background-color: #ffff00 !important;
    width: 80% !important;
}

/* Header Hamburger Button */
.realtest-header__hamburger-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    background-color: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 4px !important;
    color: #1e293b !important;
    font-size: 18px !important;
    cursor: pointer !important;
    margin-left: 8px !important;
    transition: all 0.15s ease-in-out !important;
}

.realtest-header__hamburger-btn:hover {
    background-color: #e2e8f0 !important;
    border-color: #94a3b8 !important;
}

.realtest-header__hamburger-btn i {
    font-size: 18px !important;
}

/* ==========================================================================
   UNIVERSAL HIGH CONTRAST THEME 1: WHITE ON BLACK
   ========================================================================== */

body.ielts-theme-white-on-black,
body.ielts-theme-white-on-black html,
body.ielts-theme-white-on-black #page-wrapper,
body.ielts-theme-white-on-black .dialog-off-canvas-main-canvas,
body.ielts-theme-white-on-black .take-test-page,
body.ielts-theme-white-on-black .page.take-test,
body.ielts-theme-white-on-black .take-test,
body.ielts-theme-white-on-black .test-panel,
body.ielts-theme-white-on-black .test-panel__passage,
body.ielts-theme-white-on-black .test-panel__question,
body.ielts-theme-white-on-black .test-panel__content,
body.ielts-theme-white-on-black .test-panel__item,
body.ielts-theme-white-on-black .test-panel__answers-wrap,
body.ielts-theme-white-on-black .test-contents__paragragh,
body.ielts-theme-white-on-black .passage-content,
body.ielts-theme-white-on-black .pane-passage,
body.ielts-theme-white-on-black .field-name-field-passage,
body.ielts-theme-white-on-black .take-test__player-wrap,
body.ielts-theme-white-on-black .take-test__player-container,
body.ielts-theme-white-on-black .modal-content,
body.ielts-theme-white-on-black .modal-header,
body.ielts-theme-white-on-black .modal-body,
body.ielts-theme-white-on-black .modal-footer,
body.ielts-theme-white-on-black .panel-default,
body.ielts-theme-white-on-black .panel-heading,
body.ielts-theme-white-on-black .panel-body,
body.ielts-theme-white-on-black table,
body.ielts-theme-white-on-black td,
body.ielts-theme-white-on-black th,
body.ielts-theme-white-on-black tr,
body.ielts-theme-white-on-black tbody,
body.ielts-theme-white-on-black thead {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #333333 !important;
}

/* Universal Wildcard Override for Reading & Writing Passage Area */
body.ielts-theme-white-on-black #split-one,
body.ielts-theme-white-on-black #split-one *,
body.ielts-theme-white-on-black #split-two,
body.ielts-theme-white-on-black #split-two *,
body.ielts-theme-white-on-black .take-test__questions-wrap,
body.ielts-theme-white-on-black .take-test__questions-wrap *,
body.ielts-theme-white-on-black .take-test__split-item,
body.ielts-theme-white-on-black .take-test__split-item *,
body.ielts-theme-white-on-black .take-test__board,
body.ielts-theme-white-on-black .take-test__board *,
body.ielts-theme-white-on-black .take-test__body,
body.ielts-theme-white-on-black .take-test__body *,
body.ielts-theme-white-on-black .highlighter-context,
body.ielts-theme-white-on-black .highlighter-context *,
body.ielts-theme-white-on-black #highlighter-contents,
body.ielts-theme-white-on-black #highlighter-contents *,
body.ielts-theme-white-on-black .test-contents,
body.ielts-theme-white-on-black .test-contents *,
body.ielts-theme-white-on-black .ckeditor-wrapper,
body.ielts-theme-white-on-black .ckeditor-wrapper *,
body.ielts-theme-white-on-black .test-contents__paragragh,
body.ielts-theme-white-on-black .test-contents__paragragh *,
body.ielts-theme-white-on-black .passage-content,
body.ielts-theme-white-on-black .passage-content * {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #f5f5f5 !important;
}

body.ielts-theme-white-on-black p,
body.ielts-theme-white-on-black span:not(.ielts-options-overlay *):not(.highlighted):not(.noted),
body.ielts-theme-white-on-black div:not(.ielts-options-overlay):not(.ielts-options-overlay *),
body.ielts-theme-white-on-black label,
body.ielts-theme-white-on-black h1,
body.ielts-theme-white-on-black h2:not(.ielts-options-title),
body.ielts-theme-white-on-black h3,
body.ielts-theme-white-on-black h4,
body.ielts-theme-white-on-black h5,
body.ielts-theme-white-on-black h6,
body.ielts-theme-white-on-black li,
body.ielts-theme-white-on-black td,
body.ielts-theme-white-on-black th,
body.ielts-theme-white-on-black strong,
body.ielts-theme-white-on-black b,
body.ielts-theme-white-on-black em,
body.ielts-theme-white-on-black i:not(.fa),
body.ielts-theme-white-on-black a:not(.btn):not(.realtest-header__bt-submit):not(.ielts-options-overlay *) {
    color: #ffffff !important;
}

/* 1. NOTEPAD SIDEBAR */
body.ielts-theme-white-on-black .notepad,
body.ielts-theme-white-on-black #notepad,
body.ielts-theme-white-on-black .notepad__search-form,
body.ielts-theme-white-on-black .notepad__search-results,
body.ielts-theme-white-on-black .notepad__item-wrap,
body.ielts-theme-white-on-black #notes-container,
body.ielts-theme-white-on-black .notepad__item,
body.ielts-theme-white-on-black .note-item {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #333333 !important;
    box-shadow: -4px 0 16px rgba(0,0,0,0.6) !important;
}

body.ielts-theme-white-on-black .notepad__title,
body.ielts-theme-white-on-black .notepad__text,
body.ielts-theme-white-on-black .notepad__time,
body.ielts-theme-white-on-black .notepad__close-icon,
body.ielts-theme-white-on-black .notepad__search-icon,
body.ielts-theme-white-on-black .note-text {
    color: #ffffff !important;
}

body.ielts-theme-white-on-black .notepad__input,
body.ielts-theme-white-on-black #note-search {
    background-color: #181818 !important;
    color: #ffffff !important;
    border: 1px solid #555555 !important;
}

/* 2. TEXT AFTER HIGHLIGHT */
body.ielts-theme-white-on-black span.highlighted,
body.ielts-theme-white-on-black .highlighted,
body.ielts-theme-white-on-black mark,
body.ielts-theme-white-on-black .highlight,
body.ielts-theme-white-on-black #split-one span.highlighted,
body.ielts-theme-white-on-black #split-one .highlighted,
body.ielts-theme-white-on-black #split-one mark {
    background-color: #ffeb3b !important;
    color: #000000 !important;
    font-weight: 500 !important;
    border-radius: 2px !important;
    padding: 1px 3px !important;
}

body.ielts-theme-white-on-black span.noted,
body.ielts-theme-white-on-black .noted,
body.ielts-theme-white-on-black #split-one span.noted,
body.ielts-theme-white-on-black #split-one .noted {
    background-color: #38bdf8 !important;
    color: #000000 !important;
    font-weight: 500 !important;
    border-radius: 2px !important;
    padding: 1px 3px !important;
}

/* 3. ADDING NOTE - POPUP & SAVE, CANCEL BUTTONS */
body.ielts-theme-white-on-black .highlight-box,
body.ielts-theme-white-on-black #highlight-box,
body.ielts-theme-white-on-black .highlight-box__note-content {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #444444 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.6) !important;
}

body.ielts-theme-white-on-black .highlight-box__btn {
    background-color: #262626 !important;
    color: #ffffff !important;
    border: 1px solid #444444 !important;
}

body.ielts-theme-white-on-black .highlight-box__btn:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

body.ielts-theme-white-on-black .highlight-box__textarea,
body.ielts-theme-white-on-black #user-note-input {
    background-color: #121212 !important;
    color: #ffffff !important;
    border: 1px solid #555555 !important;
}

body.ielts-theme-white-on-black .highlight-box__note-btn.-save,
body.ielts-theme-white-on-black #save-note {
    background-color: #2563eb !important;
    color: #ffffff !important;
    border: none !important;
    font-weight: 600 !important;
}

body.ielts-theme-white-on-black .highlight-box__note-btn.-save:hover,
body.ielts-theme-white-on-black #save-note:hover {
    background-color: #1d4ed8 !important;
}

body.ielts-theme-white-on-black .highlight-box__note-btn.-cancel,
body.ielts-theme-white-on-black #cancel-note {
    background-color: #374151 !important;
    color: #ffffff !important;
    border: none !important;
    font-weight: 600 !important;
}

body.ielts-theme-white-on-black .highlight-box__note-btn.-cancel:hover,
body.ielts-theme-white-on-black #cancel-note:hover {
    background-color: #4b5563 !important;
}

/* 4. SUBMIT REPORT ICONS & SELECT QUESTION FIELD */
body.ielts-theme-white-on-black .btn__report-question,
body.ielts-theme-white-on-black .realtest-header__bt-review.btn__report-question {
    color: #ef4444 !important;
    background-color: transparent !important;
}

body.ielts-theme-white-on-black .btn__report-question i,
body.ielts-theme-white-on-black .btn__report-question span {
    color: #ef4444 !important;
}

body.ielts-theme-white-on-black #report-question,
body.ielts-theme-white-on-black .modal-rpmistake,
body.ielts-theme-white-on-black .modal-rpmistake__contents,
body.ielts-theme-white-on-black #drupal-modal--content,
body.ielts-theme-white-on-black #modal-report-mistake {
    background-color: #121212 !important;
    color: #ffffff !important;
    border-color: #333333 !important;
}

body.ielts-theme-white-on-black .modal-rpmistake__title,
body.ielts-theme-white-on-black .modal-rpmistake__desc,
body.ielts-theme-white-on-black .modal-rpmistake__question,
body.ielts-theme-white-on-black .modal-rpmistake__describe-label {
    color: #ffffff !important;
}

body.ielts-theme-white-on-black select.selectpicker,
body.ielts-theme-white-on-black .bootstrap-select .btn.dropdown-toggle,
body.ielts-theme-white-on-black .bootstrap-select .dropdown-menu,
body.ielts-theme-white-on-black .bootstrap-select .dropdown-menu li a,
body.ielts-theme-white-on-black .modal-rpmistake__mess,
body.ielts-theme-white-on-black .modal-rpmistake__input {
    background-color: #181818 !important;
    color: #ffffff !important;
    border: 1px solid #555555 !important;
}

body.ielts-theme-white-on-black .bootstrap-select .dropdown-menu li a:hover,
body.ielts-theme-white-on-black .bootstrap-select .dropdown-menu li.selected a {
    background-color: #2563eb !important;
    color: #ffffff !important;
}

body.ielts-theme-white-on-black .bootstrap-select .filter-option {
    color: #ffffff !important;
}

/* 5. QUESTION'S OPTIONS CIRCLES COMPATIBILITY */
body.ielts-theme-white-on-black .form-check-label,
body.ielts-theme-white-on-black .option-item__letter,
body.ielts-theme-white-on-black .choice-letter,
body.ielts-theme-white-on-black .badge,
body.ielts-theme-white-on-black .btn-circle,
body.ielts-theme-white-on-black .question-number,
body.ielts-theme-white-on-black .test-panel__question-num {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: 1px solid #555555 !important;
}

body.ielts-theme-white-on-black .option-item.-selected .option-item__letter,
body.ielts-theme-white-on-black .option-item.is-checked .option-item__letter,
body.ielts-theme-white-on-black .form-check-input:checked + .form-check-label .option-item__letter {
    background-color: #0056b3 !important;
    color: #ffffff !important;
    border-color: #007bff !important;
}

/* 6. NAVIGATION ARROWS */
body.ielts-theme-white-on-black .test-panel__nav-btn,
body.ielts-theme-white-on-black #js-btn-previous,
body.ielts-theme-white-on-black #js-btn-next {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.5) !important;
}

body.ielts-theme-white-on-black .test-panel__nav-btn:hover:not(.-disabled) {
    background-color: #0056b3 !important;
    color: #ffffff !important;
    border-color: #007bff !important;
}

body.ielts-theme-white-on-black .test-panel__nav-btn.-disabled {
    background-color: #141414 !important;
    color: #555555 !important;
    border-color: #444444 !important;
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

body.ielts-theme-white-on-black .test-panel__nav-btn span,
body.ielts-theme-white-on-black .test-panel__nav-btn i,
body.ielts-theme-white-on-black .ioticon-prev-icon,
body.ielts-theme-white-on-black .ioticon-next-icon {
    color: inherit !important;
}

/* Inputs, Textareas, Selects */
body.ielts-theme-white-on-black input[type="text"],
body.ielts-theme-white-on-black input[type="number"],
body.ielts-theme-white-on-black textarea,
body.ielts-theme-white-on-black select,
body.ielts-theme-white-on-black .form-control {
    background-color: #181818 !important;
    color: #ffffff !important;
    border: 1px solid #555555 !important;
}

body.ielts-theme-white-on-black input::placeholder,
body.ielts-theme-white-on-black textarea::placeholder {
    color: #aaaaaa !important;
}

/* Header Bar & Buttons */
body.ielts-theme-white-on-black .realtest-header {
    background-color: #000000 !important;
    border-bottom: 1px solid #333333 !important;
}

body.ielts-theme-white-on-black .realtest-header__hamburger-btn {
    background-color: #222222 !important;
    border-color: #555555 !important;
    color: #ffffff !important;
}

/* Splitter Gutter Bar */
body.ielts-theme-white-on-black .gutter,
body.ielts-theme-white-on-black .gutter-horizontal {
    background-color: #222222 !important;
    border-left: 1px solid #444444 !important;
    border-right: 1px solid #444444 !important;
}

/* Listening Audio Player Bar */
body.ielts-theme-white-on-black .take-test__player-wrap,
body.ielts-theme-white-on-black .take-test__player-container,
body.ielts-theme-white-on-black .plyr,
body.ielts-theme-white-on-black .plyr--audio,
body.ielts-theme-white-on-black .plyr__controls {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #333333 !important;
}

body.ielts-theme-white-on-black .plyr__control {
    color: #ffffff !important;
}

/* Bottom Navigator Footer Bar & Question Palette */
/*
body.ielts-theme-white-on-black .take-test__footer,
body.ielts-theme-white-on-black .question-palette,
body.ielts-theme-white-on-black .take-test__bottom-palette,
body.ielts-theme-white-on-black .question-palette__part,
body.ielts-theme-white-on-black .question-palette__group-center,
body.ielts-theme-white-on-black .question-palette__items-group {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #333333 !important;
}

body.ielts-theme-white-on-black .question-palette__part {
    border: 1px solid #444444 !important;
    border-radius: 12px !important;
    background-color: #121212 !important;
}

body.ielts-theme-white-on-black .question-palette__item {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #444444 !important;
}

body.ielts-theme-white-on-black .question-palette__item.is-selected,
body.ielts-theme-white-on-black .question-palette__item.-active {
    background-color: #0056b3 !important;
    color: #ffffff !important;
    border-color: #007bff !important;
}

/* on answer *
body.ielts-theme-white-on-black.listening-test .question-palette__item.-checked {
    background-color: #3d3d3d !important;
    border-color: #000 !important;
}
/* answered + selectted *
body.ielts-theme-white-on-black.listening-test .question-palette__item.-checked.is-selected {
    background-color: #3d3d3d !important;
    border-color: #000 !important;
}

body.ielts-theme-white-on-black .question-palette__item.is-answered {
    border-color: #2e7d32 !important;
}

*/

body.ielts-theme-white-on-black .take-test__body span.question-palette__item.is-selected {
    border-width: 2px;
    border-style: dashed;
}

body.ielts-theme-white-on-black .take-test__body span.question-palette__item.-checked {
    color: black !important;
    background: white !important;
}

body.ielts-theme-white-on-black .take-test .question-palette__item.-group em {
    background-color: #ffffff !important;
}

body.ielts-theme-white-on-black .take-test .question-palette__item.-group.-checked em {
    background-color: #000000 !important;
}


/* Floating Action Circle Icons */
body.ielts-theme-white-on-black .js-bt-notepad,
body.ielts-theme-white-on-black #js-bt-notepad,
body.ielts-theme-white-on-black .realtest-header__icon,
body.ielts-theme-white-on-black [data-target="#modal-review-test"] {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: 1px solid #555555 !important;
}


/* ==========================================================================
   UNIVERSAL HIGH CONTRAST THEME 2: YELLOW ON BLACK
   ========================================================================== */

body.ielts-theme-yellow-on-black,
body.ielts-theme-yellow-on-black html,
body.ielts-theme-yellow-on-black #page-wrapper,
body.ielts-theme-yellow-on-black .dialog-off-canvas-main-canvas,
body.ielts-theme-yellow-on-black .take-test-page,
body.ielts-theme-yellow-on-black .page.take-test,
body.ielts-theme-yellow-on-black .take-test,
body.ielts-theme-yellow-on-black .test-panel,
body.ielts-theme-yellow-on-black .test-panel__passage,
body.ielts-theme-yellow-on-black .test-panel__question,
body.ielts-theme-yellow-on-black .test-panel__content,
body.ielts-theme-yellow-on-black .test-panel__item,
body.ielts-theme-yellow-on-black .test-panel__answers-wrap,
body.ielts-theme-yellow-on-black .test-contents__paragragh,
body.ielts-theme-yellow-on-black .passage-content,
body.ielts-theme-yellow-on-black .pane-passage,
body.ielts-theme-yellow-on-black .field-name-field-passage,
body.ielts-theme-yellow-on-black #split-one,
body.ielts-theme-yellow-on-black #split-two,
body.ielts-theme-yellow-on-black .take-test__split-item,
body.ielts-theme-yellow-on-black .take-test__board,
body.ielts-theme-yellow-on-black .take-test__body,
body.ielts-theme-yellow-on-black .highlighter-context,
body.ielts-theme-yellow-on-black #highlighter-contents,
body.ielts-theme-yellow-on-black .region-content,
body.ielts-theme-yellow-on-black article,
body.ielts-theme-yellow-on-black .field-item,
body.ielts-theme-yellow-on-black .field-items,
body.ielts-theme-yellow-on-black .take-test__player-wrap,
body.ielts-theme-yellow-on-black .take-test__player-container,
body.ielts-theme-yellow-on-black .modal-content,
body.ielts-theme-yellow-on-black .modal-header,
body.ielts-theme-yellow-on-black .modal-body,
body.ielts-theme-yellow-on-black .modal-footer,
body.ielts-theme-yellow-on-black .panel-default,
body.ielts-theme-yellow-on-black .panel-heading,
body.ielts-theme-yellow-on-black .panel-body,
body.ielts-theme-yellow-on-black table,
body.ielts-theme-yellow-on-black td,
body.ielts-theme-yellow-on-black th,
body.ielts-theme-yellow-on-black tr,
body.ielts-theme-yellow-on-black tbody,
body.ielts-theme-yellow-on-black thead {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border-color: #ffff00 !important;
}

/* Universal Wildcard Override for Reading & Writing Passage Area */
body.ielts-theme-yellow-on-black #split-one,
body.ielts-theme-yellow-on-black #split-one *,
body.ielts-theme-yellow-on-black #split-two,
body.ielts-theme-yellow-on-black #split-two *,
body.ielts-theme-yellow-on-black .take-test__questions-wrap,
body.ielts-theme-yellow-on-black .take-test__questions-wrap *,
body.ielts-theme-yellow-on-black .take-test__split-item,
body.ielts-theme-yellow-on-black .take-test__split-item *,
body.ielts-theme-yellow-on-black .take-test__board,
body.ielts-theme-yellow-on-black .take-test__board *,
body.ielts-theme-yellow-on-black .take-test__body,
body.ielts-theme-yellow-on-black .take-test__body *,
body.ielts-theme-yellow-on-black .highlighter-context,
body.ielts-theme-yellow-on-black .highlighter-context *,
body.ielts-theme-yellow-on-black #highlighter-contents,
body.ielts-theme-yellow-on-black #highlighter-contents *,
body.ielts-theme-yellow-on-black .test-contents,
body.ielts-theme-yellow-on-black .test-contents *,
body.ielts-theme-yellow-on-black .ckeditor-wrapper,
body.ielts-theme-yellow-on-black .ckeditor-wrapper *,
body.ielts-theme-yellow-on-black .test-contents__paragragh,
body.ielts-theme-yellow-on-black .test-contents__paragragh *,
body.ielts-theme-yellow-on-black .passage-content,
body.ielts-theme-yellow-on-black .passage-content * {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border-color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black p,
body.ielts-theme-yellow-on-black span:not(.ielts-options-overlay *):not(.highlighted):not(.noted),
body.ielts-theme-yellow-on-black div:not(.ielts-options-overlay):not(.ielts-options-overlay *),
body.ielts-theme-yellow-on-black label,
body.ielts-theme-yellow-on-black h1,
body.ielts-theme-yellow-on-black h2:not(.ielts-options-title),
body.ielts-theme-yellow-on-black h3,
body.ielts-theme-yellow-on-black h4,
body.ielts-theme-yellow-on-black h5,
body.ielts-theme-yellow-on-black h6,
body.ielts-theme-yellow-on-black li,
body.ielts-theme-yellow-on-black td,
body.ielts-theme-yellow-on-black th,
body.ielts-theme-yellow-on-black strong,
body.ielts-theme-yellow-on-black b,
body.ielts-theme-yellow-on-black em,
body.ielts-theme-yellow-on-black i:not(.fa),
body.ielts-theme-yellow-on-black a:not(.btn):not(.realtest-header__bt-submit):not(.ielts-options-overlay *) {
    color: #ffff00 !important;
}

/* 1. NOTEPAD SIDEBAR */
body.ielts-theme-yellow-on-black .notepad,
body.ielts-theme-yellow-on-black #notepad,
body.ielts-theme-yellow-on-black .notepad__search-form,
body.ielts-theme-yellow-on-black .notepad__search-results,
body.ielts-theme-yellow-on-black .notepad__item-wrap,
body.ielts-theme-yellow-on-black #notes-container,
body.ielts-theme-yellow-on-black .notepad__item,
body.ielts-theme-yellow-on-black .note-item {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
    box-shadow: -4px 0 16px rgba(0,0,0,0.8) !important;
}

body.ielts-theme-yellow-on-black .notepad__title,
body.ielts-theme-yellow-on-black .notepad__text,
body.ielts-theme-yellow-on-black .notepad__time,
body.ielts-theme-yellow-on-black .notepad__close-icon,
body.ielts-theme-yellow-on-black .notepad__search-icon,
body.ielts-theme-yellow-on-black .note-text {
    color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black .notepad__input,
body.ielts-theme-yellow-on-black #note-search {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

/* 2. TEXT AFTER HIGHLIGHT */
body.ielts-theme-yellow-on-black span.highlighted,
body.ielts-theme-yellow-on-black .highlighted,
body.ielts-theme-yellow-on-black mark,
body.ielts-theme-yellow-on-black .highlight,
body.ielts-theme-yellow-on-black #split-one span.highlighted,
body.ielts-theme-yellow-on-black #split-one .highlighted,
body.ielts-theme-yellow-on-black #split-one mark {
    background-color: #ffff00 !important;
    color: #000000 !important;
    font-weight: bold !important;
    border-radius: 2px !important;
    padding: 1px 3px !important;
}

body.ielts-theme-yellow-on-black span.noted,
body.ielts-theme-yellow-on-black .noted,
body.ielts-theme-yellow-on-black #split-one span.noted,
body.ielts-theme-yellow-on-black #split-one .noted {
    background-color: #facc15 !important;
    color: #000000 !important;
    font-weight: bold !important;
    border-radius: 2px !important;
    padding: 1px 3px !important;
}

/* 3. ADDING NOTE - POPUP & SAVE, CANCEL BUTTONS */
body.ielts-theme-yellow-on-black .highlight-box,
body.ielts-theme-yellow-on-black #highlight-box,
body.ielts-theme-yellow-on-black .highlight-box__note-content {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.8) !important;
}

body.ielts-theme-yellow-on-black .highlight-box__btn {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .highlight-box__btn:hover {
    background-color: #ffff00 !important;
    color: #000000 !important;
}

body.ielts-theme-yellow-on-black .highlight-box__textarea,
body.ielts-theme-yellow-on-black #user-note-input {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .highlight-box__note-btn.-save,
body.ielts-theme-yellow-on-black #save-note {
    background-color: #ffff00 !important;
    color: #000000 !important;
    border: 1px solid #ffff00 !important;
    font-weight: bold !important;
}

body.ielts-theme-yellow-on-black .highlight-box__note-btn.-cancel,
body.ielts-theme-yellow-on-black #cancel-note {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
    font-weight: bold !important;
}

/* 4. SUBMIT REPORT ICONS & SELECT QUESTION FIELD */
body.ielts-theme-yellow-on-black .btn__report-question,
body.ielts-theme-yellow-on-black .realtest-header__bt-review.btn__report-question {
    color: #ffff00 !important;
    background-color: transparent !important;
}

body.ielts-theme-yellow-on-black .btn__report-question i,
body.ielts-theme-yellow-on-black .btn__report-question span {
    color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black #report-question,
body.ielts-theme-yellow-on-black .modal-rpmistake,
body.ielts-theme-yellow-on-black .modal-rpmistake__contents,
body.ielts-theme-yellow-on-black #drupal-modal--content,
body.ielts-theme-yellow-on-black #modal-report-mistake {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .modal-rpmistake__title,
body.ielts-theme-yellow-on-black .modal-rpmistake__desc,
body.ielts-theme-yellow-on-black .modal-rpmistake__question,
body.ielts-theme-yellow-on-black .modal-rpmistake__describe-label {
    color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black select.selectpicker,
body.ielts-theme-yellow-on-black .bootstrap-select .btn.dropdown-toggle,
body.ielts-theme-yellow-on-black .bootstrap-select .dropdown-menu,
body.ielts-theme-yellow-on-black .bootstrap-select .dropdown-menu li a,
body.ielts-theme-yellow-on-black .modal-rpmistake__mess,
body.ielts-theme-yellow-on-black .modal-rpmistake__input {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .bootstrap-select .dropdown-menu li a:hover,
body.ielts-theme-yellow-on-black .bootstrap-select .dropdown-menu li.selected a {
    background-color: #ffff00 !important;
    color: #000000 !important;
}

body.ielts-theme-yellow-on-black .bootstrap-select .filter-option {
    color: #ffff00 !important;
}

/* 5. QUESTION'S OPTIONS CIRCLES COMPATIBILITY */
body.ielts-theme-yellow-on-black .form-check-label,
body.ielts-theme-yellow-on-black .option-item__letter,
body.ielts-theme-yellow-on-black .choice-letter,
body.ielts-theme-yellow-on-black .badge,
body.ielts-theme-yellow-on-black .btn-circle,
body.ielts-theme-yellow-on-black .question-number,
body.ielts-theme-yellow-on-black .test-panel__question-num {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .option-item.-selected .option-item__letter,
body.ielts-theme-yellow-on-black .option-item.is-checked .option-item__letter,
body.ielts-theme-yellow-on-black .form-check-input:checked + .form-check-label .option-item__letter {
    background-color: #ffff00 !important;
    color: #000000 !important;
    border-color: #ffff00 !important;
    font-weight: bold !important;
}

/* 6. NAVIGATION ARROWS */
body.ielts-theme-yellow-on-black .test-panel__nav-btn,
body.ielts-theme-yellow-on-black #js-btn-previous,
body.ielts-theme-yellow-on-black #js-btn-next {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 2px solid #ffff00 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.8) !important;
}

body.ielts-theme-yellow-on-black .test-panel__nav-btn:hover:not(.-disabled) {
    background-color: #ffff00 !important;
    color: #000000 !important;
    border-color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black .test-panel__nav-btn.-disabled {
    background-color: #000000 !important;
    color: #666600 !important;
    border-color: #666600 !important;
    opacity: 0.4 !important;
    cursor: not-allowed !important;
}

body.ielts-theme-yellow-on-black .test-panel__nav-btn span,
body.ielts-theme-yellow-on-black .test-panel__nav-btn i,
body.ielts-theme-yellow-on-black .ioticon-prev-icon,
body.ielts-theme-yellow-on-black .ioticon-next-icon {
    color: inherit !important;
}

/* Inputs, Textareas, Selects */
body.ielts-theme-yellow-on-black input[type="text"],
body.ielts-theme-yellow-on-black input[type="number"],
body.ielts-theme-yellow-on-black textarea,
body.ielts-theme-yellow-on-black select,
body.ielts-theme-yellow-on-black .form-control {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black input::placeholder,
body.ielts-theme-yellow-on-black textarea::placeholder {
    color: #cccc00 !important;
}

/* Header Bar & Buttons */
body.ielts-theme-yellow-on-black .realtest-header {
    background-color: #000000 !important;
    border-bottom: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .realtest-header__hamburger-btn {
    background-color: #000000 !important;
    border-color: #ffff00 !important;
    color: #ffff00 !important;
}

/* Splitter Gutter Bar */
body.ielts-theme-yellow-on-black .gutter,
body.ielts-theme-yellow-on-black .gutter-horizontal {
    background-color: #000000 !important;
    border-left: 1px solid #ffff00 !important;
    border-right: 1px solid #ffff00 !important;
}

/* Listening Audio Player Bar */
body.ielts-theme-yellow-on-black .take-test__player-wrap,
body.ielts-theme-yellow-on-black .take-test__player-container,
body.ielts-theme-yellow-on-black .plyr,
body.ielts-theme-yellow-on-black .plyr--audio,
body.ielts-theme-yellow-on-black .plyr__controls {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border-bottom: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .plyr__control {
    color: #ffff00 !important;
}

/* Bottom Navigator Footer Bar & Question Palette */
/*
body.ielts-theme-yellow-on-black .take-test__footer,
body.ielts-theme-yellow-on-black .question-palette,
body.ielts-theme-yellow-on-black .take-test__bottom-palette,
body.ielts-theme-yellow-on-black .question-palette__part,
body.ielts-theme-yellow-on-black .question-palette__group-center,
body.ielts-theme-yellow-on-black .question-palette__items-group {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border-color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black .question-palette__part {
    border: 1px solid #ffff00 !important;
    border-radius: 12px !important;
    background-color: #000000 !important;
}

body.ielts-theme-yellow-on-black .question-palette__item {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}

body.ielts-theme-yellow-on-black .question-palette__item.is-selected,
body.ielts-theme-yellow-on-black .question-palette__item.-active {
    background-color: #ffff00 !important;
    color: #000000 !important;
    border-color: #ffff00 !important;
    font-weight: bold !important;
}
*/

body.ielts-theme-yellow-on-black .take-test__body span.question-palette__item.is-selected {
    border-width: 2px;
    border-style: dashed;
}

body.ielts-theme-yellow-on-black.reading-test .take-test__body span.question-palette__item.-checked, 
body.ielts-theme-yellow-on-black.listening-test .take-test__body span.question-palette__item.-checked {
    color: black !important;
    background: #ffff00 !important;
}

body.ielts-theme-yellow-on-black .take-test .question-palette__item.-group em {
    background-color: #ffff00 !important;
}

body.ielts-theme-yellow-on-black .take-test .question-palette__item.-group.-checked em {
    background-color: #000000 !important;
}

/* Floating Action Circle Icons */
body.ielts-theme-yellow-on-black .js-bt-notepad,
body.ielts-theme-yellow-on-black #js-bt-notepad,
body.ielts-theme-yellow-on-black .realtest-header__icon,
body.ielts-theme-yellow-on-black [data-target="#modal-review-test"] {
    background-color: #000000 !important;
    color: #ffff00 !important;
    border: 1px solid #ffff00 !important;
}


/* ==========================================================================
   EXPLICIT DYNAMIC TEXT SIZE SCALING (Reading, Listening, Writing)
   ========================================================================== */

/* --------------------------------------------------------------------------
   LARGE TEXT SIZE (+25% Larger than Regular)
   -------------------------------------------------------------------------- */

/* Universal Passage & Question Content (Reading, Listening, Writing) */
body.ielts-text-large #split-one p,
body.ielts-text-large #split-one span:not(#ielts-options-overlay *),
body.ielts-text-large #split-one div:not(.gutter):not(.take-test__split-item):not(.highlighter-context),
body.ielts-text-large #split-one li,
body.ielts-text-large #split-one td,
body.ielts-text-large #split-one th,
body.ielts-text-large #split-two p,
body.ielts-text-large #split-two span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-large #split-two label,
body.ielts-text-large #split-two li,
body.ielts-text-large #split-two td,
body.ielts-text-large #split-two th,
body.ielts-text-large .take-test__questions-wrap,
body.ielts-text-large .take-test__questions-wrap p,
body.ielts-text-large .take-test__questions-wrap span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-large .take-test__questions-wrap label,
body.ielts-text-large .take-test__questions-wrap li,
body.ielts-text-large .take-test__questions-wrap div:not(.option-item__letter):not(.choice-letter):not(.badge):not(.question-palette__item),
body.ielts-text-large .test-contents,
body.ielts-text-large .test-contents p,
body.ielts-text-large .test-contents span:not(#ielts-options-overlay *),
body.ielts-text-large .test-contents__paragragh,
body.ielts-text-large .test-contents__paragragh p,
body.ielts-text-large .test-contents__paragragh span:not(#ielts-options-overlay *),
body.ielts-text-large .passage-content,
body.ielts-text-large .passage-content p,
body.ielts-text-large .passage-content span:not(#ielts-options-overlay *),
body.ielts-text-large .ckeditor-wrapper,
body.ielts-text-large .ckeditor-wrapper p,
body.ielts-text-large .ckeditor-wrapper span:not(#ielts-options-overlay *),
body.ielts-text-large .test-panel__question,
body.ielts-text-large .test-panel__question p,
body.ielts-text-large .test-panel__question span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-large .question-item,
body.ielts-text-large .question-item p,
body.ielts-text-large .question-item span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-large .question-board,
body.ielts-text-large .question-board p,
body.ielts-text-large .question-board span:not(#ielts-options-overlay *),
body.ielts-text-large .option-item,
body.ielts-text-large .choice-text,
body.ielts-text-large .form-check-label {
    font-size: 19px !important;
    line-height: 1.65 !important;
}

body.ielts-text-large #split-one h1,
body.ielts-text-large #split-one h2,
body.ielts-text-large #split-one h3,
body.ielts-text-large #split-two h1,
body.ielts-text-large #split-two h2,
body.ielts-text-large #split-two h3,
body.ielts-text-large .take-test__questions-wrap h1,
body.ielts-text-large .take-test__questions-wrap h2,
body.ielts-text-large .take-test__questions-wrap h3,
body.ielts-text-large .ckeditor-wrapper h1,
body.ielts-text-large .ckeditor-wrapper h2,
body.ielts-text-large .ckeditor-wrapper h3,
body.ielts-text-large .test-panel__title,
body.ielts-text-large .question-title {
    font-size: 24px !important;
    line-height: 1.4 !important;
}

body.ielts-text-large #split-one h4,
body.ielts-text-large #split-one h5,
body.ielts-text-large #split-one h6,
body.ielts-text-large #split-two h4,
body.ielts-text-large #split-two h5,
body.ielts-text-large #split-two h6,
body.ielts-text-large .take-test__questions-wrap h4,
body.ielts-text-large .take-test__questions-wrap h5,
body.ielts-text-large .take-test__questions-wrap h6,
body.ielts-text-large .ckeditor-wrapper h4,
body.ielts-text-large .ckeditor-wrapper h5,
body.ielts-text-large .ckeditor-wrapper h6 {
    font-size: 21px !important;
    line-height: 1.4 !important;
}

/* Inputs, Textareas, Selects for Large */
body.ielts-text-large input[type="text"],
body.ielts-text-large input[type="number"],
body.ielts-text-large textarea,
body.ielts-text-large select,
body.ielts-text-large .form-control {
    font-size: 19px !important;
}

body.ielts-text-large .option-item__letter,
body.ielts-text-large .choice-letter,
body.ielts-text-large .question-number,
body.ielts-text-large .test-panel__question-num {
    font-size: 18px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    line-height: 30px !important;
    text-align: center !important;
}

body.ielts-text-large .question-palette__item {
    /* font-size: 16px !important; */
}

body.ielts-text-large .table-responsive .table tbody tr td {
    font-size: 19px;
}



/* --------------------------------------------------------------------------
   EXTRA LARGE TEXT SIZE (+50% Larger than Regular)
   -------------------------------------------------------------------------- */

/* Universal Passage & Question Content (Reading, Listening, Writing) */
body.ielts-text-extra-large #split-one p,
body.ielts-text-extra-large #split-one span:not(#ielts-options-overlay *),
body.ielts-text-extra-large #split-one div:not(.gutter):not(.take-test__split-item):not(.highlighter-context),
body.ielts-text-extra-large #split-one li,
body.ielts-text-extra-large #split-one td,
body.ielts-text-extra-large #split-one th,
body.ielts-text-extra-large #split-two p,
body.ielts-text-extra-large #split-two span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-extra-large #split-two label,
body.ielts-text-extra-large #split-two li,
body.ielts-text-extra-large #split-two td,
body.ielts-text-extra-large #split-two th,
body.ielts-text-extra-large .take-test__questions-wrap,
body.ielts-text-extra-large .take-test__questions-wrap p,
body.ielts-text-extra-large .take-test__questions-wrap span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-extra-large .take-test__questions-wrap label,
body.ielts-text-extra-large .take-test__questions-wrap li,
body.ielts-text-extra-large .take-test__questions-wrap div:not(.option-item__letter):not(.choice-letter):not(.badge):not(.question-palette__item),
body.ielts-text-extra-large .test-contents,
body.ielts-text-extra-large .test-contents p,
body.ielts-text-extra-large .test-contents span:not(#ielts-options-overlay *),
body.ielts-text-extra-large .test-contents__paragragh,
body.ielts-text-extra-large .test-contents__paragragh p,
body.ielts-text-extra-large .test-contents__paragragh span:not(#ielts-options-overlay *),
body.ielts-text-extra-large .passage-content,
body.ielts-text-extra-large .passage-content p,
body.ielts-text-extra-large .passage-content span:not(#ielts-options-overlay *),
body.ielts-text-extra-large .ckeditor-wrapper,
body.ielts-text-extra-large .ckeditor-wrapper p,
body.ielts-text-extra-large .ckeditor-wrapper span:not(#ielts-options-overlay *),
body.ielts-text-extra-large .test-panel__question,
body.ielts-text-extra-large .test-panel__question p,
body.ielts-text-extra-large .test-panel__question span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-extra-large .question-item,
body.ielts-text-extra-large .question-item p,
body.ielts-text-extra-large .question-item span:not(#ielts-options-overlay *):not(.option-item__letter):not(.choice-letter),
body.ielts-text-extra-large .question-board,
body.ielts-text-extra-large .question-board p,
body.ielts-text-extra-large .question-board span:not(#ielts-options-overlay *),
body.ielts-text-extra-large .option-item,
body.ielts-text-extra-large .choice-text,
body.ielts-text-extra-large .form-check-label {
    font-size: 24px !important;
    line-height: 1.7 !important;
}

body.ielts-text-extra-large #split-one h1,
body.ielts-text-extra-large #split-one h2,
body.ielts-text-extra-large #split-one h3,
body.ielts-text-extra-large #split-two h1,
body.ielts-text-extra-large #split-two h2,
body.ielts-text-extra-large #split-two h3,
body.ielts-text-extra-large .take-test__questions-wrap h1,
body.ielts-text-extra-large .take-test__questions-wrap h2,
body.ielts-text-extra-large .take-test__questions-wrap h3,
body.ielts-text-extra-large .ckeditor-wrapper h1,
body.ielts-text-extra-large .ckeditor-wrapper h2,
body.ielts-text-extra-large .ckeditor-wrapper h3,
body.ielts-text-extra-large .test-panel__title,
body.ielts-text-extra-large .question-title {
    font-size: 29px !important;
    line-height: 1.4 !important;
}

body.ielts-text-extra-large #split-one h4,
body.ielts-text-extra-large #split-one h5,
body.ielts-text-extra-large #split-one h6,
body.ielts-text-extra-large #split-two h4,
body.ielts-text-extra-large #split-two h5,
body.ielts-text-extra-large #split-two h6,
body.ielts-text-extra-large .take-test__questions-wrap h4,
body.ielts-text-extra-large .take-test__questions-wrap h5,
body.ielts-text-extra-large .take-test__questions-wrap h6,
body.ielts-text-extra-large .ckeditor-wrapper h4,
body.ielts-text-extra-large .ckeditor-wrapper h5,
body.ielts-text-extra-large .ckeditor-wrapper h6 {
    font-size: 26px !important;
    line-height: 1.4 !important;
}

/* Inputs, Textareas, Selects for Extra Large */
body.ielts-text-extra-large input[type="text"],
body.ielts-text-extra-large input[type="number"],
body.ielts-text-extra-large textarea,
body.ielts-text-extra-large select,
body.ielts-text-extra-large .form-control {
    font-size: 23px !important;
}

body.ielts-text-extra-large .option-item__letter,
body.ielts-text-extra-large .choice-letter,
body.ielts-text-extra-large .question-number,
body.ielts-text-extra-large .test-panel__question-num {
    font-size: 21px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    line-height: 34px !important;
    text-align: center !important;
}

body.ielts-text-extra-large .question-palette__item {
    /* font-size: 18px !important; */
}

body.ielts-text-extra-large .table-responsive .table tbody tr td {
    font-size: 23px;
}

/* -------------------------------------------------------------------------------------------//
// ---------------------------------- ielts-theme-white-on-black -----------------------------//
//----------------------------------------------------------------------------------------------*/

/* ------------------ input checkbox:radio --------------------- */
/* checkbox::unchecked */
body.ielts-theme-white-on-black #split-two .iot-checkbox2 .checkmark, body.ielts-theme-white-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 .checkmark{
    border: 1px solid #ffffff !important;
}
/* checkbox::checked */
body.ielts-theme-white-on-black #split-two .iot-checkbox2 input:checked ~ .checkmark, body.ielts-theme-white-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 input:checked ~ .checkmark {
    background-color: #ffffff !important;
}
/* checkbox inner check */
body.ielts-theme-white-on-black #split-two .iot-checkbox2 .checkmark::after, body.ielts-theme-white-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 .checkmark::after {
    border: 0px solid #fff;
}

body.ielts-theme-white-on-black #split-two .iot-checkbox2 .checkmark::after, body.ielts-theme-white-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 .checkmark::after {
    content: "";
    position: absolute;
    top: calc(50% - 2px);
    left: 50%;
    display: table;
    width: 5px;
    height: 10px;
    border: 1px solid #000000;
    border-top-width: 0;
    border-left-width: 0;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    -o-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
}


/* ----------------- radio input ------------------- */
body.ielts-theme-white-on-black #split-two .iot-radio input[type="radio"]:checked, body.ielts-theme-white-on-black.listening-test #highlighter-contents .iot-radio input[type="radio"]:checked {
    border: 1px solid #ffffff;
    background-color: #ffffff !important;
}


/* -------------------------------------------------------------------------------------------//
// ---------------------------------- ielts-theme-yellow-on-black -----------------------------//
//----------------------------------------------------------------------------------------------*/
/* ------------------ input checkbox:radio --------------------- */
/* checkbox::unchecked */
body.ielts-theme-yellow-on-black #split-two .iot-checkbox2 .checkmark, body.ielts-theme-yellow-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 .checkmark{
    border: 1px solid #ffff00 !important;
}
/* checkbox::checked */
body.ielts-theme-yellow-on-black #split-two .iot-checkbox2 input:checked ~ .checkmark, body.ielts-theme-yellow-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 input:checked ~ .checkmark {
    background-color: #ffff00 !important;
}
/* checkbox inner check */
body.ielts-theme-yellow-on-black #split-two .iot-checkbox2 .checkmark::after, body.ielts-theme-yellow-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 .checkmark::after {
    border: 0px solid #ff0;
}

body.ielts-theme-yellow-on-black #split-two .iot-checkbox2 .checkmark::after, body.ielts-theme-yellow-on-black.listening-test #highlighter-contents .take-test__questions-wrap .iot-checkbox2 .checkmark::after {
    content: "";
    position: absolute;
    top: calc(50% - 2px);
    left: 50%;
    display: table;
    width: 5px;
    height: 10px;
    border: 1px solid #000000;
    border-top-width: 0;
    border-left-width: 0;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    -o-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
}


/* ----------------- radio input ------------------- */


body.ielts-theme-yellow-on-black #split-two .iot-radio input[type="radio"]:checked, body.ielts-theme-yellow-on-black.listening-test #highlighter-contents .iot-radio input[type="radio"]:checked {
    border: 1px solid #ffff00;
    background-color: #ffff00 !important;
}

/** -------------- no change --------------- **/
div#js-click-play {
    color: black !important;
}

div#js-click-play span {
    color: #2fa4b7 !important;
}