/* =========================================================
   az-ace.css — the code editor's syntax colours, from tokens.

   WHY THIS FILE EXISTS
   lib/webforge/ace.js ships its own theme (theme-chrome.js) with a hardcoded
   palette. It is a vendor file, so it is not edited: this stylesheet loads
   AFTER it and overrides the colour declarations only. Ace's own rules are
   `.ace-chrome .ace_x`, and these match that specificity exactly, so the
   later one wins with no !important anywhere.

   WHAT IT FIXES
   Eight of the vendor colours fail WCAG 2.1 on white:

       .ace_support.ace_type          3.86    (22 measured instances)
       .ace_support.ace_constant      3.91    (11)
       .ace_variable                  4.32    (3)
       .ace_string.ace_regex          4.00
       .ace_variable.ace_parameter    2.18
       .ace_invisible                 1.84
       .ace_constant.ace_library      3.91

   Only three showed up in the audit, because the rest need code on screen
   that the initial view does not contain. All eight are corrected here.

   WHY TWELVE TOKENS AND NOT ONE
   Syntax highlighting exists to make roles distinguishable. Collapsing the
   family to var(--primary) would make code one flat colour and stop it doing
   its job -- the same argument themevars.py makes for keeping the --c-*
   family on distinct tokens. The twelve are pinned in az-theme.css and
   re-declared in the dark scope, so switching the editor's theme moves them
   without touching this file.
   ========================================================= */

/* The editor surface itself follows the scope. */
.ace-chrome,
.ace-chrome .ace_scroller           { background-color: var(--paper); color: var(--text); }
.ace-chrome .ace_gutter             { background: var(--surface-2); color: var(--muted); }
.ace-chrome .ace_gutter-active-line { background-color: var(--surface); }
.ace-chrome .ace_print-margin       { background: var(--line); }
.ace-chrome .ace_cursor             { color: var(--text); }
.ace-chrome .ace_indent-guide       { background: var(--line); }

/* Selection and markers read from the brand, so they move with the palette. */
.ace-chrome .ace_marker-layer .ace_selection      { background: color-mix(in srgb,var(--primary) 22%,var(--paper)); }
.ace-chrome .ace_marker-layer .ace_selected-word  { background: color-mix(in srgb,var(--primary) 12%,var(--paper)); }
.ace-chrome .ace_marker-layer .ace_active-line    { background: color-mix(in srgb,var(--primary) 7%,var(--paper)); }
.ace-chrome .ace_marker-layer .ace_step           { background: color-mix(in srgb,var(--warning) 30%,var(--paper)); }
.ace-chrome .ace_marker-layer .ace_stack          { background: color-mix(in srgb,var(--success) 30%,var(--paper)); }

/* Syntax roles. */
.ace-chrome .ace_invisible                        { color: var(--code-mute); }
.ace-chrome .ace_keyword.ace_operator             { color: var(--code-mute); }
.ace-chrome .ace_xml-pe                           { color: var(--code-mute); }

.ace-chrome .ace_storage,
.ace-chrome .ace_keyword,
.ace-chrome .ace_meta.ace_tag                     { color: var(--code-keyword); }

.ace-chrome .ace_string                           { color: var(--code-string); }
.ace-chrome .ace_string.ace_regex                 { color: var(--code-regex); }
.ace-chrome .ace_constant.ace_numeric             { color: var(--code-number); }

.ace-chrome .ace_comment,
.ace-chrome .ace_comment.ace_doc,
.ace-chrome .ace_comment.ace_doc.ace_tag          { color: var(--code-comment); }

.ace-chrome .ace_support.ace_type,
.ace-chrome .ace_support.ace_class,
.ace-chrome .ace_support.ace_other                { color: var(--code-type); }

.ace-chrome .ace_support.ace_function,
.ace-chrome .ace_entity.ace_name.ace_function     { color: var(--code-func); }

.ace-chrome .ace_variable                         { color: var(--code-var); }
.ace-chrome .ace_variable.ace_parameter           { color: var(--code-param); }

.ace-chrome .ace_constant.ace_buildin,
.ace-chrome .ace_constant.ace_language,
.ace-chrome .ace_constant.ace_library,
.ace-chrome .ace_support.ace_constant             { color: var(--code-const); }

.ace-chrome .ace_entity.ace_other.ace_attribute-name { color: var(--code-attr); }
.ace-chrome .ace_heading                          { color: var(--code-func); }
.ace-chrome .ace_list                             { color: var(--code-keyword); }

.ace-chrome .ace_invalid                          { background-color: var(--code-invalid); color: var(--paper); }