>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3565091. --> Reported by: [salmonek](https://www.drupal.org/user/3104645) Related to !734 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>Dialog windows in CKEditor 5 have light font on light background when using Gin in dark mode.</p> <p>I suppose this was omitted since there is no toolbar enabled CKEditor 5 plugin that opens in dialog and is available in Drupal core. The Accessibility help that can be opened with <code>Alt+0</code> shorcut can show the issue:</p> <p><img src="https://www.drupal.org/files/issues/2025-12-29/gin-ckeditor-dialog-dark-before.png" alt="before"></p> <p>The dialogs are used in few plugins that we have in CKEditor 5 Plugin Pack and it is possible that some custom plugins will use it too.<br> The issue was reported in our module for the "Find and replace" plugin, however I think it is worth to fix it directly in Gin as here it will help in more cases.</p> <h4 id="summary-steps-reproduce">Steps to reproduce</h4> <p>Set Dark mode in Gin settings<br> Open a page that contains CKEditor<br> Set focus on CKEditor<br> Use a <code>Alt+0</code> shortcut</p> <h3 id="summary-proposed-resolution">Proposed resolution</h3> <p>Update the ckeditor5 styles by casting --gin variables to some additional --ck variables:</p> <pre>+&nbsp; --ck-color-dialog-background: var(--gin-bg-layer3);<br>+&nbsp; --ck-color-dialog-form-header-border: var(--gin-border-color-form-element);<br>+&nbsp; --ck-accessibility-help-dialog-code-background-color: var(--gin-bg-layer4);</pre><p>Result:<br> <img src="https://www.drupal.org/files/issues/2025-12-29/gin-ckeditor-dialog-dark-after.png" alt="after dark"></p> <p>Light theme also remains readable after the change:<br> <img src="https://www.drupal.org/files/issues/2025-12-29/gin-ckeditor-dialog-light-after.png" alt="after light"></p> <h3 id="summary-remaining-tasks">Remaining tasks</h3> <p>Review</p>