:root {
    --bg: #0f172a;
    --panel: #020617;
    --border: #1e293b;
    --text: #e5e7eb;
    --muted: #9ca3af;
    --accent: #22c55e;
    --danger: #ef4444;
    --warning-accent: #ffb400;
    --warning-bg: rgba(255, 180, 0, 0.08);
    --warning-text: #e6e6e6;
    --warning-title: #f8a807;
}

body {
    margin: 0;
    font-family: "Manrope", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    background: var(--bg);
    color: var(--text);
}

.status-line {
    color: #cec6c6;
}

a {
    color: #73aae1; /* sets normal link color */
}

a:hover {
    color: #68ff00 !important; /* when hovered */
}

a:visited {
    color: #73aae1; /* after visiting */
}

a:active {
    color: #ff4500; /* when clicked */
}

#prompt {
    border: 1px solid #3399ff;
    background: #353434;
    color: #fff4f4;
}

.user {
    background: #10a37f;
    color: #fff;
}

.bot {
    background: #353131;
    color: #e3e3e3;
    border: 1px solid #2c2c2c;
}

.typing {
    color: #32cd32; /* lime green */
    background: #1a2b1a;
    border: 1px solid #32cd32;
}

.chat-intro {
    color: #c4bebe;
}

.report-issue {
    text-align: right;
    margin-top: 6px;
}

.report-issue a {
    color: #68ff00;
    font-size: 12px;
    opacity: 1;
}

.report-issue a:hover {
    opacity: 1;
}

.hljs-keyword, .hljs-selector-tag, .hljs-literal {
    color: #7aa2f7 !important;
}

.hljs-string, .hljs-title, .hljs-name {
    color: #9ece6a !important;
}

.hljs-comment {
    color: #10e3d2 !important;
    font-style: italic;
}

.hljs-number {
    color: #e0af68 !important;
}

.hljs-built_in, .hljs-class .hljs-title, .hljs-title.class_ {
    color: #de9715;
}

/* Preserve multiline formatting in dark mode */
.message pre {
    white-space: pre !important;
}

.message pre code.hljs {
    white-space: pre !important;
    display: block !important;
    padding: 0;
    line-height: 1.45;
    background: transparent !important;
}

.hljs {
    white-space: pre !important;
    display: block !important;
    background: #2b3030 !important;
    color: #dcdcdc !important;
    /*border: 1px solid #868585*/
}

/* --- ChatGPT-style bot reply bubble --- */
.message {
    max-width: 90%;
    width: 100%;
    box-sizing: border-box;
}

#chat {
    width: 100%;
    box-sizing: border-box;
    scrollbar-color: rgba(255,255,255,0.3) transparent;
}


/*padding: 16px 8px 80px 8px;*/

.message.bot {
    color: #e3e3e3;
    border: 1px solid #8c8585;
    border-radius: 12px 12px 12px 0;
    padding: 12px 16px;
    margin: 8px 0;
    line-height: 1.5;
    font-size: 13px;
    max-width: 1000px;
    margin: 0 auto;
    word-wrap: break-word;
    font-family: Manrope;
    background: #1f1f1f;
}

.message.user {
    background: rgb(2, 63, 119) !important;
    color: #fff;
    align-self: flex-end;
    border-radius: 12px 12px 12px 12px;
    padding: 0px 10px;
    margin: 15px 0;
    max-width: 65%;
    font-size: 14px;
    max-width: 65%;
    line-height: 1.4;
    word-wrap: break-word;
    margin-left: auto;
    border: 1px solid #868383;
}

/* --- Copy button for code blocks --- */
/*.copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    background: rgba(255,255,255,0.1);
    color: #f1e9e9 !important;
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 4px;
    font-size: 12px;
    padding: 2px 6px;
    cursor: pointer;
    opacity: 1;
    transition: opacity 0.2s;
}*/

pre {
    position: relative;
}

.copy-btn {
    background: #2b2b2b;
    color: white;
    border: 1px solid #bdc6bc;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 4px;
    cursor: pointer;
    opacity: 0.85;
    transition: opacity 0.2s;
}

.copy-btn:hover {
    opacity: 1;
    color: limegreen !important;
}

/* Top right */
/*.copy-btn-top {
    top: 8px;
    right: 8px;
}*/

/* Bottom right */
.copy-btn-bottom {
    bottom: 16px;
    right: 14px;
}

.usage-summary {
    color: #3c8f98;
    border-top: 1px solid rgb(229 25 224 / 35%);
}

.system-msg {
    color: #08ffea;
    font-style: italic;
    margin: 10px 0;
    padding: 6px 10px;
    border-left: 3px solid #5ef10a;
}

.blocked-warning {
    margin-top: 12px;
    padding: 12px 14px;
    border-left: 4px solid #c0392b;
    background: rgb(192 57 43 / 30%);
    color: #d5d1d1;
    font-weight: 500;
    border-radius: 12px;
    padding: 16px;
}

.blocked-warning strong {
    display: block;
    margin-bottom: 4px;
}

.blocked-cta {
    margin-top: 8px;
}

.blocked-cta a {
    font-weight: 600;
    text-decoration: underline;
}

.rag-debug {
    font-size: 12px;
    color: #47de2a;
    margin-top: 10px;
    opacity: 0.85;
}

.web-debug {
    font-size: 12px;
    margin-bottom: 6px;
    color: #f5ac01;
}

.web-debug-rejected,
.web-debug-empty {
    color: #f5ac01;
}

.message.bot h1,
.message.bot h2,
.message.bot h3,
.message.bot h4 {
    color: #ddd;
    margin-top: 14px;
    margin-bottom: 6px;
    font-weight: 600;
}

/* TASKS */
.cp-overlay__title {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.2px;
    color: rgba(255, 255, 255, 0.95);
}

.cp-overlay__subtitle {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.70);
}

.cp-model-rec__primary {
    background: #3b82f680;
    border: 1px solid rgba(0, 180, 255, 0.4);
    color: whitesmoke !important;
}

#backToTasks {
    min-width: 220px;
    padding: 14px 22px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 14px;
    border: 1px solid #9a9898;
}

#clearChatExamples {
    min-width: 100px;
    padding: 14px 22px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 14px;
}

.cp-btn-clear {
    position: relative;
    background: #1a1a1a;
    color: #ff6b6b;
    border: 1px solid #ff6b6b;
    padding: 9px 16px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
}

.cp-advanced-toggle a {
    font-size: 12px;
    color: #8fd3ff;
    text-decoration: none;
    cursor: pointer;
}

/* task examples buttons */
.cp-model-rec__models a.cp-model-rec__badge {
    color: #e5e7eb !important;
}

/* Load code from button to convert indicator */
.open-file-btn {
    margin-right: 8px;
    padding: 6px 12px;
    font-size: 13px;
    border-radius: 6px;
    border: 1px solid #3b3f46;
    background: #1f2937;
    color: #e5e7eb;
    cursor: pointer;
}

.open-file-btn:hover {
    background: #2b3545;
}

.cp-help-link {
    color: #8fd3ff !important;
    text-decoration: none;
}

.account-link {
    color: #ffffff !important;
    opacity: 0.85;
}

.account-link:hover {
    opacity: 1;
    font-weight: 500;
    color: #ffffff !important
}

.cp-inline-version {
    color: whitesmoke !important;
}

.cp-inline-version::after {
    background: rgba(255, 180, 0, 0.12);
    color: #ffcc66;
}

/* Active model */
.app__aside-ai-link.active {
    border: none;
    background: linear-gradient(131.19deg, #f85e76 1.106%, #a324b0 22.109%, #7807cd 45.466%, #514fd8 73.913%, #2baedf 103.301%)
}

.credit-badge {
    background: #1e293b;
    color: #bec1c6;
}

.btn-help {
    background: transparent;
    border: 1px solid #10e3d2;
    color: #ccd1da;
}

.btn-help:hover {
    border-color: #29bb23;
    color: #29bb23;
    background: rgba(41, 187, 35, 0.08);
}

.cp-examples-badge {
    color: #e0f2fe;
    background: linear-gradient( 180deg, rgba(56,189,248,0.22), rgba(56,189,248,0.12) );
    border: 1px solid rgba(56,189,248,0.5);
}

.cp-examples-badge:hover {
    background: rgba(56,189,248,0.28);
    border-color: rgba(56,189,248,0.8);
    color: #ffffff;
}

.cp-history-toggle {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    color: #fff;
}

.cp-history-toggle:hover {
    background: linear-gradient(135deg, #8c1be0, #6263f0);
    box-shadow: 0 0 0 2px rgba(120, 7, 205, 0.25);
}

.btn-report-build {
    background: transparent;
    border: 1px solid #10e3d2;
    color: #ccd1da;
}

.btn-report-build:hover {
    border-color: #ef4444;
    color: #ef4444;
    background: rgba(239, 68, 68, 0.08);
}

#send,
#stop {
    background: #020617;
    color: #e5e7eb;
    border: 1px solid #a0a2a5;
}

#send {
    border-color: #3b82f6; 
    background-color: #16a34a;
    color: #ffffff;
}

#send:hover {
    border-color: #ccc;
    box-shadow: 0 0 0 4px rgba(148,163,184,0.25);
    background-color: #16a34a;
}

.task-status--idle {
    background: #1f2937;
    color: #9ca3af;
}

.verify-btn {
    background: #1f2937;
    border: 1px solid #1dc564;
}

.verify-btn:hover {
    background: #2a3442;
}

/* Download algo button */
.algo-btn {
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    transition: 0.2s ease;
}

/* Disabled */
.algo-btn-disabled {
    background: #2a2f3a;
    border: 1px solid #3b4150;
    color: #777;
    cursor: not-allowed;
}

/* Enabled */
.algo-btn-enabled {
    background: #00a86b;
    border: 1px solid #008f5a;
    color: white;
}

.algo-btn-enabled:hover {
    background: #008f5a;
}

/* Build download */
.algo-btn-enabled {
    background: #1e88e5;
    border-color: #1976d2;
}

.algo-btn-busy {
    opacity: 0.7;
    cursor: wait;
    color: #fff
}

.cp-history-panel {
    background: linear-gradient(180deg, #111827 0%, #0b1220 100%);
    color: #e5e7eb;
}

#cp-history-title {
    background: #020617;
    color: #e5e7eb;
}

#cp-history-summary {
    background: #020617;
    color: #e5e7eb;
}

.cp-history-form label {
    color: #afb1b4;
}

.cp-history-saved-header {
    color: #afb1b4;
}

.cp-history-item {
    background: linear-gradient(180deg, #050b1a, #030815);
    border: 1px solid rgb(255 255 255 / 41%);
}

.cp-history-item.active {
    background: linear-gradient(180deg, #020617, #020617);
    box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.6), 0 6px 18px rgba(56, 189, 248, 0.25);
}

.cp-history-meta {
    color: #888e88;
}

.cp-history-list {
    scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}

/* Repair mode */
.repair-controls {
    background: #0f172a;
}

.repair-header {
    background: #3990d92e;
}

.repair-output {
    background: #0b0f17;
}

cp-example-card .cp-card__desc {
    color: rgba(255, 255, 255, 0.74);
}

.cp-example-card .cp-card__title {
    color: #afc6f5;
}

.cp-model-rec__models a.cp-model-rec__badge {
    border: 1px solid rgb(130 123 123 / 0%);
}

/* bug fixing task */

.build-error-message {
    color: #e5e7eb;
}

/* Success state */
.build-success {
    background: #1d3326;
    border: 1px solid #2c6a47;
    padding: 12px;
    color: #22c55e;
    font-weight: 600;
}

.app__aside-model-info {
    margin-top: 20px;
    margin-left: 12px;
    padding-top: 15px;
    border-top: 1px solid rgb(190 4 247 / 52%);
}

.app__aside-model-info-link {
    display: block;
    font-size: 13px;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.app__aside-model-info-link:hover {
    opacity: 1;
}

.feedback-comment textarea {
    background: #292c3a;
    color: #e5e7eb;
}

.thumb-btn:hover {
    border-color: rgba(255,255,255,0.35);
}

.ctrader-help-box {
    background: #0f172a;
    color: #e5e7eb;
}

.sidebar-toggle {
    background: transparent;
    color: #ffffff;
}

.build-error-block {
    border: 1px solid rgba(239, 68, 68, 0.5);
    background: rgba(15, 23, 42, 0.6);
}

.build-error-content {
    color: #fca5a5;
}

.build-error-help {
    color: #e7e7e7;
    font-size: 13px;
}

.xen-video-guide {
    color:aliceblue
}

.xen-video-guide:hover {
    color: #ffffff;
}

.xen-video-guide:visited {
    color: #ffffff;
}

.mode-text {
    color: #cfd8dc;
}

.repair-editor-tab strong {
    color: #f8fafc;
}

.build-info-repair {
    color: #93c5fd;
}

.build-success {
    color: #bbf7d0;
}

.repair-card-text small {
    color: #cbd5e1;
}

#repairDownloadBtn.algo-btn-enabled {
    background: rgba(22, 101, 52, 0.22);
}

.repair-info-strip strong {
    color: #f8fafc;
}

body.light .repair-editor-panel,
body.light .repair-output,
body.light .repair-action-card,
body.light .repair-small-card,
body.light .repair-copy-btn {
    border-color: #cbd5e1;
}