/* Code Editor Styles */

/* Base Editor (Simple) */
#codeEditor {
    font-family: 'Fira Code', 'Consolas', monospace;
    font-size: 14px;
    line-height: 1.6;
    padding: 15px;
    background-color: var(--code-bg);
    color: var(--code-color);
    border: 1px solid var(--code-border);
    border-radius: var(--border-radius);
}

/* CodeMirror Overrides */
.CodeMirror {
    font-family: 'Fira Code', 'Consolas', monospace;
    font-size: 14px;
    border: 1px solid var(--code-border);
    border-radius: var(--border-radius);
    height: auto;
}

/* Theme specific adjustments for CodeMirror are handled by the CM themes (monokai/default) 
   but we can ensure the container matches our variables */

[data-theme="light"] .CodeMirror {
    border-color: var(--border-color);
}

[data-theme="dark"] .CodeMirror {
    border-color: var(--border-color);
    /* Safety net: force dark background if theme switch fails */
    background-color: #272822 !important; 
    color: #f8f8f2 !important;
}

/* Force default theme to look dark in dark mode (fallback) */
[data-theme="dark"] .cm-s-default.CodeMirror {
    background-color: #272822 !important;
    color: #f8f8f2 !important;
}

[data-theme="dark"] .cm-s-default .CodeMirror-gutters {
    background-color: #272822 !important;
    border-right: 1px solid #444 !important;
}

[data-theme="dark"] .cm-s-default .CodeMirror-linenumber {
    color: #d0d0d0 !important;
}

/* Fix for Python Playground Output */
.python-playground .output-area {
    background-color: var(--bg-secondary);
    color: var(--text-main);
    border: 1px solid var(--border-color);
    padding: 1rem;
    border-radius: var(--border-radius);
    margin-top: 0.5rem;
    font-family: monospace;
    white-space: pre-wrap;
}

[data-theme="dark"] .python-playground .output-area {
    background-color: #1e1e1e; /* Slightly darker than secondary for terminal feel */
    color: #f8f8f2;
}

/* Coloration syntaxique Python pour CodeMirror - Mode Sombre (Monokai) */
.cm-s-monokai.CodeMirror { background: #272822 !important; color: #f8f8f2 !important; }
.cm-s-monokai div.CodeMirror-selected { background: #49483E; }
.cm-s-monokai .CodeMirror-line::selection, .cm-s-monokai .CodeMirror-line > span::selection, .cm-s-monokai .CodeMirror-line > span > span::selection { background: rgba(73, 72, 62, .99); }
.cm-s-monokai .CodeMirror-line::-moz-selection, .cm-s-monokai .CodeMirror-line > span::-moz-selection, .cm-s-monokai .CodeMirror-line > span > span::-moz-selection { background: rgba(73, 72, 62, .99); }
.cm-s-monokai .CodeMirror-gutters { background: #272822 !important; border-right: 0px; }
.cm-s-monokai .CodeMirror-guttermarker { color: white; }
.cm-s-monokai .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
.cm-s-monokai .CodeMirror-linenumber { color: #d0d0d0 !important; }
.cm-s-monokai .CodeMirror-cursor { border-left: 1px solid #f8f8f0 !important; }

/* Ensure cursor is visible in default theme too */
.cm-s-default .CodeMirror-cursor { border-left: 1px solid black !important; }
[data-theme="dark"] .cm-s-default .CodeMirror-cursor { border-left: 1px solid white !important; }

.cm-s-monokai span.cm-comment { color: #75715e !important; }
.cm-s-monokai span.cm-atom { color: #ae81ff !important; }
.cm-s-monokai span.cm-number { color: #ae81ff !important; }

.cm-s-monokai span.cm-comment.cm-attribute { color: #97b757 !important; }
.cm-s-monokai span.cm-comment.cm-def { color: #bc9262 !important; }
.cm-s-monokai span.cm-comment.cm-tag { color: #bc6283 !important; }
.cm-s-monokai span.cm-comment.cm-type { color: #5998a6 !important; }

.cm-s-monokai span.cm-property, .cm-s-monokai span.cm-attribute { color: #a6e22e !important; }
.cm-s-monokai span.cm-keyword { color: #f92672 !important; }
.cm-s-monokai span.cm-builtin { color: #66d9ef !important; }
.cm-s-monokai span.cm-string { color: #e6db74 !important; }

.cm-s-monokai span.cm-variable { color: #f8f8f2 !important; }
.cm-s-monokai span.cm-variable-2 { color: #9effff !important; }
.cm-s-monokai span.cm-variable-3, .cm-s-monokai span.cm-type { color: #66d9ef !important; }
.cm-s-monokai span.cm-def { color: #fd971f !important; }
.cm-s-monokai span.cm-bracket { color: #f8f8f2 !important; }
.cm-s-monokai span.cm-tag { color: #f92672 !important; }
.cm-s-monokai span.cm-header { color: #ae81ff !important; }
.cm-s-monokai span.cm-link { color: #ae81ff !important; }
.cm-s-monokai span.cm-error { background: #f92672 !important; color: #f8f8f0 !important; }

.cm-s-monokai .CodeMirror-activeline-background { background: #373831; }
.cm-s-monokai .CodeMirror-matchingbracket {
  text-decoration: underline;
  color: white !important;
}

/* Solution Code */
.solution-code pre {
    margin: 0;
    padding: 0;
    background-color: var(--code-bg) !important;
}

.solution-code code {
    font-family: 'Fira Code', 'Consolas', monospace;
    font-size: 14px;
    line-height: 1.6;
    display: block;
    white-space: pre;
    color: var(--code-color);
}