/*
 * IELTS pages in plain black and white. Loaded last on every IELTS template, so it overrides the warm paper,
 * cream and yellow tones of the shared Study and landing styles. Green stays only for "done"; red only for errors.
 * Contrast: body text #111 on #fff (18.9:1), secondary text #3d3d3d (10.9:1), borders #000 or #bdbdbd.
 */
body[data-study-mode="ielts"] {
  /* Shared landing and Study tokens */
  --ink: #000;
  --ink-2: #111;
  --ink-3: #000;
  --paper: #fff;
  --rule: #d4d4d4;
  --pen: #000;
  --red: #000;
  --muted-light: #3d3d3d;
  --muted-dark: #d6d6d6;
  /* IELTS tokens */
  --ir-ink: #000;
  --ir-ink-2: #111;
  --ir-paper: #fff;
  --ir-card: #fff;
  --ir-line: #bdbdbd;
  --ir-text: #111;
  --ir-muted: #3d3d3d;
  --ir-on-ink: #fff;
  --ir-on-ink-muted: #d6d6d6;
  --ir-pen: #000;
  --ir-hi: #e6e6e6;
  --ir-track: #e3e3e3;
  background: #fff;
  color: #111;
}
body[data-study-mode="ielts"] .paper { background: #fff; }

/* Header: white with a black rule, black text. */
body[data-study-mode="ielts"] .site-header { background: #fff; border-bottom: 2px solid #000; }
body[data-study-mode="ielts"] .site-header .wordmark { color: #000; }
body[data-study-mode="ielts"] .site-header .wordmark small { color: #3d3d3d; }
body[data-study-mode="ielts"] .site-header :is(.desktop-nav a, .login-link) { color: #222; }
body[data-study-mode="ielts"] .site-header :is(.desktop-nav a, .login-link):hover,
body[data-study-mode="ielts"] .site-header .desktop-nav a[aria-current="page"] { color: #000; text-decoration: underline; text-underline-offset: 4px; }
body[data-study-mode="ielts"] .study-language-switch { background: #fff; color: #3d3d3d; border-color: #000; }
body[data-study-mode="ielts"] .study-language-switch:hover { border-color: #000; background: #f2f2f2; }
body[data-study-mode="ielts"] .study-language-switch:focus-visible { outline-color: #000; }
body[data-study-mode="ielts"] .language-switch-track { background: #bdbdbd; }
body[data-study-mode="ielts"] .language-switch-track::before { background: #fff; }
body[data-study-mode="ielts"] .study-language-switch[aria-checked="true"] .language-switch-track { background: #000; }
body[data-study-mode="ielts"] .study-language-switch[aria-checked="true"] .language-switch-track::before { background: #fff; }
body[data-study-mode="ielts"] .study-language-switch[aria-checked="true"] [lang="vi"],
body[data-study-mode="ielts"] .study-language-switch[aria-checked="false"] [lang="en"] { color: #000; font-weight: 700; }

/* Buttons: solid black for the main action, outlined black for the second one. */
body[data-study-mode="ielts"] :is(.btn-hi, .btn-ink) { background: #000; color: #fff; border-color: #000; }
body[data-study-mode="ielts"] :is(.btn-hi, .btn-ink):hover { background: #333; border-color: #333; color: #fff; }
body[data-study-mode="ielts"] .btn-pro { background: #fff; color: #000; border-color: #000; }
body[data-study-mode="ielts"] .btn-pro:hover { background: #000; color: #fff; }
body[data-study-mode="ielts"] :is(.btn, .text-link, a):focus-visible { outline: 3px solid #000; outline-offset: 2px; }
/* On the black bands (tool heroes, paywalls, footer) the buttons invert. */
body[data-study-mode="ielts"] :is(.ielts-hero, .paywall, .wc-paywall, .site-footer, [data-band="ink"]) :is(.btn-hi, .btn-ink) { background: #fff; color: #000; border-color: #fff; }
body[data-study-mode="ielts"] :is(.ielts-hero, .paywall, .wc-paywall, .site-footer, [data-band="ink"]) :is(.btn-hi, .btn-ink):hover { background: #e6e6e6; border-color: #e6e6e6; color: #000; }
body[data-study-mode="ielts"] :is(.ielts-hero, .paywall, .wc-paywall) .btn-pro { background: transparent; color: #fff; border-color: #fff; }
body[data-study-mode="ielts"] :is(.ielts-hero, .paywall, .wc-paywall) .btn-pro:hover { background: #fff; color: #000; }
body[data-study-mode="ielts"] :is(.ielts-hero, .paywall, .wc-paywall) :is(.ielts-kicker, .kicker) { color: #fff; }

/* Footer: black. */
body[data-study-mode="ielts"] .site-footer { background: #000; border-top: 0; }
body[data-study-mode="ielts"] .site-footer .wordmark, body[data-study-mode="ielts"] .site-footer .wordmark span { color: #fff; }

/* Links and small accents that were blue or yellow. */
body[data-study-mode="ielts"] main a:not(.btn) { color: inherit; }
body[data-study-mode="ielts"] .badge-free { background: #fff; color: #000; border: 1.5px solid #000; }
body[data-study-mode="ielts"] .badge-pro { background: #000; color: #fff; border: 1.5px solid #000; }
body[data-study-mode="ielts"] .step-pill { background: #000; color: #fff; }
body[data-study-mode="ielts"] .rm-step[data-state="next"] a { background: #f2f2f2; }
body[data-study-mode="ielts"] .rm-step-type,
body[data-study-mode="ielts"] .rm-step[data-kind="exercise"] .rm-step-type { color: #000; }
body[data-study-mode="ielts"] .progress-fill { background: #000; }
body[data-study-mode="ielts"] .progress-on-ink { background: #3d3d3d; }
body[data-study-mode="ielts"] .progress-on-ink .progress-fill { background: #fff; }
body[data-study-mode="ielts"] [data-complete="true"] > .progress-fill,
body[data-study-mode="ielts"] .progress-fill[data-complete="true"] { background: #11643f; }

/* Shared accent token: light grey instead of yellow (tips, hovers, free badges, button borders). */
body[data-study-mode="ielts"] { --hi: #e6e6e6; }
body[data-study-mode="ielts"] .btn { border-color: #000; }
body[data-study-mode="ielts"] .lesson-body strong { background: linear-gradient(transparent 62%, #dcdcdc 62%); font-weight: 700; }
body[data-study-mode="ielts"] .lesson-tip { background: #f2f2f2; border-color: #000; }
body[data-study-mode="ielts"] :is(.lesson-list, .module-grid) a:hover { background: #f2f2f2; }

/* Exercise workbook: white, black rules, no green tint. Green and amber stay only on right / wrong answers. */
body[data-study-mode="ielts"] .ielts-workbook { background: #fff; border: 1.5px solid #000; color: #111; }
body[data-study-mode="ielts"] .ielts-workbook .kicker { color: #000; }
body[data-study-mode="ielts"] .ielts-source { border-left-color: #000; background: #f5f5f5; }
body[data-study-mode="ielts"] .ielts-caption, body[data-study-mode="ielts"] .ielts-draft-meta { color: #3d3d3d !important; }
body[data-study-mode="ielts"] .ielts-workbook :is(textarea, input[type=text]) { border-color: #000; color: #111; }
body[data-study-mode="ielts"] .ielts-workbook :is(textarea, input):focus { outline-color: #000; }
body[data-study-mode="ielts"] .ielts-question { border-bottom-color: #d4d4d4; }
body[data-study-mode="ielts"] .ielts-question input[type=radio] { accent-color: #000; }
body[data-study-mode="ielts"] .ielts-answer-feedback { background: #f2f2f2; color: #111; }
body[data-study-mode="ielts"] .ielts-table-wrap :is(th, td), body[data-study-mode="ielts"] .ielts-map > div,
body[data-study-mode="ielts"] .ielts-process li { border-color: #bdbdbd; }
body[data-study-mode="ielts"] .ielts-table-wrap th { background: #f0f0f0; }
body[data-study-mode="ielts"] .ielts-process li::before { color: #000; }
body[data-study-mode="ielts"] .ielts-workbook details { border-top-color: #d4d4d4; }
body[data-study-mode="ielts"] .ielts-feedback-card { border-color: #000; }
body[data-study-mode="ielts"] .ielts-band { color: #000; }
body[data-study-mode="ielts"] .ielts-correction { border-left-color: #000; }
body[data-study-mode="ielts"] .ielts-workbook .text-link { background: none; border: 0; padding: 0; color: #000; font: inherit; text-decoration: underline; cursor: pointer; }