/* Color Definitions */
:root {
  --sigma-blue: #00bbe6;
  --sigma-dark: #12141c;
}

::selection {
  color: white;
  background: var(--sigma-blue);
}

.text-sigma-blue {
  color: var(--sigma-blue);
}

.bg-sigma-blue {
  background-color: var(--sigma-blue);
}

.border-sigma-blue {
  border-color: var(--sigma-blue);
}

.text-sigma-dark {
  color: var(--sigma-dark);
}

.bg-sigma-dark {
  background-color: var(--sigma-dark);
}

.border-sigma-dark {
  border-color: var(--sigma-dark);
}

/* Code Area CSS */
pre:has(> #rule-code),
pre:has(> #pipeline-code),
pre:has(> #query-code) {
  min-height: 200px;
  cursor: text;
}

pre:has(> #rule-code:empty)::after {
  content: "start writing your sigma rule...";
  color: #c5c8c6;
  width: 20px;
}

pre:has(> #pipeline-code:empty)::after {
  content: "start writing your post processing pipeline...";
  color: #c5c8c6;
  width: 20px;
}

div[class*="language-yaml"],
code[class*="language-yaml"],
code[class*="language-yaml"] *,
pre[class*="language-yaml"] {
  word-break: break-word !important;
  white-space: pre !important;
}

code[class*="language-kusto"],
code[class*="language-kusto"] *,
pre[class*="language-kusto"] {
  word-break: break-word !important;
  white-space: pre-line !important;
}

code[class*="language-splunk"],
code[class*="language-splunk"] *,
pre[class*="language-splunk"] {
  word-break: break-word !important;
  white-space: pre-line !important;
}

code[class*="language-sql"],
code[class*="language-sql"] *,
pre[class*="language-sql"] {
  word-break: break-word !important;
  white-space: pre-line !important;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
  background-color: var(--sigma-dark) !important;
}

div[class*="language-"]::selection,
div[class*="language-"] span::selection,
code[class*="language-"]::selection,
code[class*="language-"] span::selection {
  background: var(--sigma-blue);
  color: var(--sigma-dark);
}

.token.atrule,
.token.attr-value,
.token.function,
.token.property,
.token.keyword,
.token.string {
  color: var(--sigma-blue) !important;
}

.token.attr-name,
.token.builtin,
.token.char,
.token.inserted,
.token.selector,
.token.string {
  color: white !important;
}

/* tom-select css override */
.select-sigma > .ts-control,
.select-sigma > .ts-control input {
  color: white;
  background-color: var(--sigma-dark) !important;
  border-color: var(--sigma-blue) !important;
}

.select-sigma > .ts-dropdown [data-selectable].option {
  color: var(--sigma-blue);
  background-color: var(--sigma-dark);
}

.select-sigma > .ts-dropdown [data-selectable].option.active {
  color: white;
  background-color: var(--sigma-blue);
}

.select-sigma input[type="checkbox"] {
  background-color: var(--sigma-dark);
}

.select-sigma input[type="checkbox"]:checked {
  background-color: var(--sigma-blue);
  border-color: var(--sigma-dark);
}

.select-sigma.ts-wrapper.multi .ts-control > div {
  color: white;
  background-color: var(--sigma-dark);
  border: 1px solid var(--sigma-blue);
  border-radius: 2px;
}

.select-sigma > .ts-dropdown,
.select-sigma.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
  border-color: var(--sigma-blue);
}