@font-face {
  font-family: "futurapt_book";
  src: url("./fonts/futurapt/FuturaPT-Book.woff") format("woff"), url("./fonts/futurapt/FuturaPT-Book.ttf") format("truetype");
  font-style: normal;
}
@font-face {
  font-family: "futurapt_bold";
  src: url("./fonts/futurapt/FuturaPT-Bold.woff") format("woff"), url("./fonts/futurapt/FuturaPT-Bold.ttf") format("truetype");
  font-style: normal;
}
@font-face {
  font-family: "futurapt_medium";
  src: url("./fonts/futurapt/FuturaPT-Medium.woff") format("woff"), url("./fonts/futurapt/FuturaPT-Medium.ttf") format("truetype");
  font-style: normal;
}
@font-face {
  font-family: "futurapt_demi";
  src: url("./fonts/futurapt/FuturaPT-Demi.woff") format("woff"), url("./fonts/futurapt/FuturaPT-Demi.ttf") format("truetype");
  font-style: normal;
}



@font-face {
  font-family: "Roboto";
  src: url("./fonts/Roboto/Roboto-Regular.ttf") format("truetype");
  font-style: normal;
}

@font-face {
  font-family: "Roboto";
  src: url("./fonts/Roboto/Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: bold;
}

@font-face {
  font-family: "Roboto";
  src: url("./fonts/Roboto/Roboto-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
}

html, body {
  height: 100%;
  margin: 0;
}

body {
  font-size: 1rem;
  line-height: 1.5;
  font-family: Roboto;
}

.h-100-header {
  height: calc(100vh - 56px);
}

.no-margins {
  margin: 0;
}

.side-bar-icon {
  visibility: hidden;
  opacity: 0;
  transition: 0.3s;
}

.analysis-component {
  position: relative;
  background-color: var(--app-bg);
}

.analysis-component:hover .side-bar-icon, .text-widget-container:hover .side-bar-icon {
  visibility: visible;
  opacity: 1;
}

.folders-list {
  display: flex;
  padding: 0 10px 0 10px;
  flex-wrap: wrap;
}

.folder-container {
  display: flex;
  flex: 0 1;
  white-space: nowrap;
  flex-direction: column;
  background: var(--app-surface);
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 0px 1px var(--app-surface) inset;
  padding: 14px 26px;
  border-radius: 110px;
  margin-bottom: 10px;
  cursor: pointer;
  margin-right: 10px;
}

.folder-container:last-child {
  margin-right: 0px;
}

.folder-container.active {
  border: 1px solid #00B2FF;
  box-shadow: 0px 0px 0px 1px #00B2FF inset;
}

.folder-container.active .folder-name {
  font-weight: 500;
}

.folder-name, .folder-add {
  /*display: flex;*/
  position: relative;
  align-items: center;
  width: 100%;
  color: var(--app-text);
  font-family: Roboto;
  font-size: 13.5px;
}

.folder-add {
  margin: auto;
}

.folder-name::after {
  display: block;
  content: attr(title);
  font-weight: 500;
  height: 1px;
  color: transparent;
  overflow: hidden;
  visibility: hidden;
}

.process-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 10px 0 0;
}

.node-percent__stat {
  border-radius: 100%;
  background-color: var(--app-primary-blue);
  color: #FFFFFF;
  width: 42px;
  height: 42px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 15px;
  font-size: 16px;
  vertical-align: middle;
  text-align: center;
  font-weight: bold;
  transition: background-color 2s, opacity 2s;
}

.p-flex-container {
  display: flex;
}

.v-flex-container {
  display: flex;
  flex-direction: column;
}

.overflow-hidden {
  overflow: hidden;
}


.h-100 {
  height: 100% !important;
}

*, :after, :before {
  box-sizing: border-box;
}

img, svg {
  vertical-align: middle;
}

img {
  border-style: none;
}

.btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}

.v-context {
  position: absolute;
  z-index: 1000;
  list-style: none;
  padding: 10px;
  margin: 0;
  font-family: Roboto;
  font-size: 14px;
  font-weight: normal;
  background: var(--app-surface);
  box-shadow: 0px 0px 34px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  text-decoration: none;
  color: var(--app-text);
  top: 80px;
  min-width: 170px;
}

.v-context.top-arrow:before {
  content: '';
  display: block;
  position: absolute;
  left: calc(50% - 5px);
  bottom: 100%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
}

.v-context.top-arrow:after {
  content: '';
  display: block;
  position: absolute;
  left: calc(50% - 5px);
  bottom: 100%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-bottom-color: var(--app-surface);
}

.parent-full-size {
  width: 100%;
  height: 100%;
}

/*h6 {*/
/*  font-size: 15px;*/
/*  font-family: Roboto;*/
/*}*/
/*.profile-container {*/
/*  padding: 80px 40px 0 40px;*/
/*}*/

/*.profile-form__container {*/
/*  display: flex;*/

/*}*/
/*.form-col {*/
/*  flex-basis: 50%;*/
/*  max-width: 500px;*/
/*}*/

/*.form-col + .form-col {*/
/*  margin-left: 50px;*/
/*}*/


/*.form-buttons {*/
/*  display: flex;*/
/*  margin: 10px 0;*/
/*}*/

/*.form-buttons__btn {*/
/*  padding: 0.75rem 1.75rem;*/
/*}*/
/*.form-buttons__btn:not(.no-width) {*/
/*  flex-basis: 50%;*/
/*}*/

/*.form-buttons__btn + .form-buttons__btn {*/
/*  margin-left: 10px;*/
/*}*/


.new-source-file {
  border: 1px dashed rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  height: 209px;
  cursor: pointer;
}

.new-file-container, .uploaded-file-container {
  display: flex;
  align-items: center;
  height: 100%;
}

.uploaded-file-container, .container-drag-over {
  background-color: rgba(0, 249, 55, 0.11);
}

.source-file-upload-info {
  display: flex;
  align-items: center;
}

.new-source-file-icon {
  height: 100%;
  width: 120px;
  flex: 0 0 120px;
  display: flex;
  margin: auto;
}

.new-file-container .new-source-file-icon {
  border-right: 1px dashed rgba(0, 0, 0, 0.15);
}

.uploaded-file-container .new-source-file-icon {
  border-right: none;
  border-left: 1px solid rgba(0, 249, 55, 0.2);
}

.uploaded-file-container .new-source-file-icon img {
  transform: rotate(45deg);
}

.new-source-file-icon img {
  margin: auto;
}

.new-source-file-text {
  font-size: 13px;
  font-family: Roboto;
  line-height: 140%;
  padding: 0 48px;
  margin: auto;
  display: flex;
}

.new-source-file-text span {
  margin: auto;
}

.uploaded-file-icon {
  width: 40px;
  height: 40px;
  margin-right: 15px;
  border-radius: 100%;
  background-color: #00F937;
}

.hidden-upload {
  display: none;
  opacity: 0;
  z-index: -2;
}

.upload-vertical .uploaded-file-container .new-source-file-icon {
  border-left: none;
  border-top: 1px solid rgba(0, 249, 55, 0.2);
}

.upload-vertical .new-file-container, .upload-vertical .uploaded-file-container {
  flex-direction: column;
}

.upload-vertical .new-source-file-icon {
  width: 100%;
  height: 120px;
  flex: 0 0 50%;
  display: flex;
  margin: 0 !important;
}

.upload-vertical .new-file-container .new-source-file-icon {
  border-bottom: 1px dashed rgba(0, 0, 0, 0.15);
}

.rtl-dir {
  direction: rtl;
}

.CodeMirror {
  height: 100% !important;
  font-size: 13px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.datepicker-input {
  box-shadow: none !important;
  border: none !important;
}

.datepicker-filter .mx-input-wrapper {
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
}

.datepicker-filter .datepicker-input {
  margin-left: auto;
  margin-right: auto;
}

.datepicker-filter .mx-icon-calendar, .datepicker-filter .mx-icon-clear {
    position: unset !important;
    top: 50%;
    right: 8px;
    transform: none !important;
    font-size: 16px;
    line-height: 1;
    color: rgba(0, 0, 0, .5);
    /* vertical-align: middle; */
}

.fs-6, .fs-6 input {
  font-size: 6px !important;
}

.fs-7, .fs-7 input {
  font-size: 7px !important;
}

.fs-8, .fs-8 input {
  font-size: 8px !important;
}

.fs-9, .fs-9 input {
  font-size: 9px !important;
}

.fs-10, .fs-10 input {
  font-size: 10px !important;
}

.fs-11, .fs-11 input {
  font-size: 11px !important;
}

.fs-12, .fs-12 input {
  font-size: 12px !important;
}

.fs-13, .fs-13 input {
  font-size: 13px !important;
}

.fs-14, .fs-14 input {
  font-size: 14px !important;
}

.fs-15, .fs-15 input {
  font-size: 15px !important;
}

.fs-16, .fs-16 input {
  font-size: 16px !important;
}

.fs-17, .fs-17 input {
  font-size: 17px !important;
}

.fs-18, .fs-18 input {
  font-size: 18px !important;
}

.fs-19, .fs-19 input {
  font-size: 19px !important;
}

.fs-20, .fs-20 input {
  font-size: 20px !important;
}

.fs-21, .fs-21 input {
  font-size: 21px !important;
}

.fs-22, .fs-22 input {
  font-size: 22px !important;
}

.fs-23, .fs-23 input {
  font-size: 23px !important;
}

.fs-24, .fs-24 input {
  font-size: 24px !important;
}

/* Application color tokens; dark values are enabled by html.theme-dark. */
:root {
  color-scheme: light;
  --app-bg: #ffffff;
  --app-surface: #ffffff;
  --app-surface-raised: #f3f3f3;
  --app-surface-hover: #f1f1f1;
  --app-border: #e1e1e1;
  --app-node-border: #e7e7e7;
  --app-edge-label-bg: #f3f3f3;
  --app-text: #333333;
  --app-text-muted: #7b7b7b;
  --app-accent: #00b2ff;
  --app-primary-blue: #00AEF9;
  --app-shadow: rgba(0, 0, 0, 0.12);
  --app-nav: #2a3034;
  --app-overlay: rgba(248, 249, 250, 0.78);
  --app-accent-soft: #ddf5ff;
  --app-graph-highlight: #FF8855;
  --app-surface-translucent: rgba(255, 255, 255, 0.8);
}
html.theme-dark {
  color-scheme: dark;
  --app-bg: #0f141b;
  --app-surface: #171e27;
  --app-surface-raised: #202936;
  --app-surface-hover: #293545;
  --app-border: #344252;
  --app-node-border: #797C7F;
  --app-edge-label-bg: transparent;
  --app-text: #e7edf4;
  --app-text-muted: #9eabb9;
  --app-primary-blue: #0B76B0;
  --app-shadow: rgba(0, 0, 0, 0.45);
  --app-nav: #121923;
  --app-overlay: rgba(5, 8, 12, 0.78);
  --app-accent-soft: rgba(0, 178, 255, 0.16);
  --app-graph-highlight: #FFC633;
  --app-surface-translucent: rgba(32, 41, 54, 0.88);
}

html.theme-dark,
html.theme-dark body,
html.theme-dark #app,
html.theme-dark .component-container { background: var(--app-bg); color: var(--app-text); }
html.theme-dark :is(body, button, input, textarea, select) { color: var(--app-text); }
html.theme-dark :is(input, textarea, select, .c-input, .select-button, .options, .find-options,
.datepicker-input, .mx-input, .CodeMirror, .CodeMirror-gutters) {
  background-color: var(--app-surface) !important;
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
}
html.theme-dark input::placeholder,
html.theme-dark textarea::placeholder { color: var(--app-text-muted) !important; }
html.theme-dark :is(input, textarea, select, button):disabled {
  color: var(--app-text-muted) !important;
  opacity: .65;
}
html.theme-dark :is(.process-card, .new-process-card, .folder-container, .comp-card__container,
.dash-block__col, .col__row, .chart-container, .table-component__container,
.table-component__body, .table-container, .side-bar-stats, .embedded-side-statistics,
.side-bar-bookmarks, .modal-container, .modal-content, .modal__content,
.form-container, .filter-content, .stat-container, .properties-container,
.sql-editor-container, .sql-editor-col, .open-ai-chat-container, .chat-container,
.message-area, .input-area, .input-container, .hcpm-main, .hcpm-side, .hcpm-row,
.span-details, .detail-block, .new-source-file, .v-context, .overflow-dropdown,
.context-menu, .select-container, .select-container__search-block,
.select-container__value-block, .mx-datepicker-popup, .mx-calendar,
.tox .tox-edit-area__iframe, .tox .tox-toolbar, .tox .tox-toolbar__overflow,
.tox .tox-toolbar__primary) {
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
  box-shadow: none;
}
html.theme-dark .new-dash-item {
  border-color: var(--app-text-muted) !important;
}
html.theme-dark .edit-custom-layout {
  background-image: linear-gradient(rgba(231, 237, 244, 0.08) .1em, transparent .1em),
    linear-gradient(90deg, rgba(231, 237, 244, 0.08) .1em, transparent .1em) !important;
}
html.theme-dark :is(.process-card.card_colored, .card-cell:nth-child(odd) .process-card.card_colored,
.card-cell:nth-child(even) .process-card.card_colored, .uploaded-file-container,
.container-drag-over) { background: var(--app-surface-raised) !important; }
html.theme-dark :is(.table-header, .table-heading, .hcpm-row--head, thead, th, .tools__panel,
.properties-switch__control) {
  background-color: var(--app-surface-raised) !important;
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
}
html.theme-dark .c-input input[type="checkbox"]:checked + .c-input__label::before {
  background-image: url("data:image/svg+xml,%3Csvg width=%2715%27 height=%2713%27 viewBox=%270 0 15 13%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M13 1L6 10L1 6%27 stroke=%27%23E7EDF4%27 stroke-width=%273%27/%3E%3C/svg%3E");
}
html.theme-dark :is(.properties-switch__control, .pattern-detection-toggle__switch) {
  background-color: var(--app-border) !important;
}
html.theme-dark :is(.properties-switch_active .properties-switch__control,
.pattern-detection-toggle__switch.active) {
  background-color: var(--app-accent) !important;
}
html.theme-dark :is(tr, td, .table-val, .option, .value-block__option, .bookmark-row, .span-row,
.kv-list div, .kv-table div) { color: var(--app-text) !important; border-color: var(--app-border) !important; }
html.theme-dark :is(tr, .option, .value-block__option, .bookmark-row, .span-row,
.overflow-dropdown-item, .v-context li):hover { background-color: var(--app-surface-hover) !important; }
html.theme-dark .options .option.opt-disabled,
html.theme-dark .options .option.opt-disabled:hover {
  background-color: rgba(158, 171, 185, 0.08) !important;
  cursor: not-allowed;
  opacity: .55;
}
html.theme-dark .options .option.opt-disabled .label {
  color: var(--app-text-muted) !important;
  cursor: not-allowed;
}
html.theme-dark :is(h1, h2, h3, h4, h5, h6, label, .label, .folder-name, .process-name,
.node-title__name, .node-title__info, .stat-header, .stat-value,
.table-component__title, .table-heading__name, .pattern-detection-toggle__label,
.properties-switch__label, .dash-name, .content, .span-row__name,
.span-details__header, .detail-section, .kv-list dd, .kv-table dd) { color: var(--app-text) !important; }
html.theme-dark :is(.process-upload-date, .process-source, .cases-count, .c-input__label, .table-val,
.stat-container ul, .counts-info, .input-question-label, .span-row__duration,
.span-row__tokens, .kv-list dt, .kv-table dt, .detail-source) { color: var(--app-text-muted) !important; }
html.theme-dark :is(.brd, .b-brd, .border-left, .pattern-detection-toggle, .table-heading,
.table-val, .hcpm-row, .span-row, .detail-block, .new-source-file,
.folder-container) { border-color: var(--app-border) !important; }
html.theme-dark .folder-container.active,
html.theme-dark .select-container:focus-within,
html.theme-dark select:focus {
  border-color: var(--app-accent) !important;
  box-shadow: 0 0 0 1px var(--app-accent) !important;
  outline: none;
}
html.theme-dark :is(input, textarea):focus {
  border-color: var(--app-border) !important;
  box-shadow: none !important;
  outline: none;
}
html.theme-dark :is(.modal-mask, .loading-overlay .overlay__background, .col-filter-mask) {
  background-color: var(--app-overlay) !important;
}
html.theme-dark .bg-nav { background-color: var(--app-nav) !important; border-bottom: 1px solid var(--app-border); }
html.theme-dark :is(.btn:not(.custom-button), .map-button, .animations-controls__button,
.bpmn__control-button) { color: var(--app-text); border-color: var(--app-border); }
html.theme-dark :is(.btn:not(.custom-button), .map-button, .animations-controls__button,
.bpmn__control-button):hover { background-color: var(--app-surface-hover); border-color: var(--app-accent); }
html.theme-dark .node-container {
  background-color: var(--app-surface) !important;
  border-color: var(--app-node-border) !important;
  color: var(--app-text) !important;
  box-shadow: 0 8px 24px var(--app-shadow);
}
html.theme-dark .node-container__active {
  background-color: var(--app-surface-raised) !important;
  border-color: #ff8855 !important;
  box-shadow: 0 0 0 2px var(--app-bg) inset, 0 8px 24px var(--app-shadow) !important;
}
html.theme-dark .end-start-node { background-color: transparent !important; box-shadow: none; }
html.theme-dark .edge-label {
  background-color: transparent !important;
  color: var(--app-text) !important;
}
html.theme-dark :is(.insight-data-container, .g6-component-tooltip, .heatmap-aggregation-select li) {
  background-color: var(--app-surface-raised) !important;
  color: var(--app-text) !important;
}
html.theme-dark .graph-data-type__count img { filter: invert(1) brightness(1.45); }
html.theme-dark :is(.mx-icon-calendar, .mx-icon-clear, .chevrons, .settings-cog img,
.header-action-icon img, .chart-container__setting-icon) { filter: brightness(0) invert(1); opacity: .78; }
html.theme-dark .process-action-button img { filter: brightness(0) invert(1); }
html.theme-dark .process-folder__menu-button span { background: var(--app-text); }
html.theme-dark .close-cross { filter: brightness(0) invert(1); }
html.theme-dark .sql-editor-cm .CodeMirror {
  background: var(--app-surface) !important;
  color: var(--app-text) !important;
}
html.theme-dark .sql-editor-cm .CodeMirror-gutters {
  background: var(--app-surface-raised) !important;
  border-color: var(--app-border) !important;
}
html.theme-dark .sql-editor-cm .CodeMirror-linenumber { color: #aab6c4; }
html.theme-dark .sql-editor-cm .CodeMirror-cursor {
  border-left: 2px solid #ffffff !important;
}
html.theme-dark .sql-editor-cm .CodeMirror-selected,
html.theme-dark .sql-editor-cm .CodeMirror-focused .CodeMirror-selected {
  background: rgba(0, 178, 255, 0.32) !important;
}
html.theme-dark .sql-editor-cm .cm-keyword { color: #7dd3fc; font-weight: 600; }
html.theme-dark .sql-editor-cm .cm-operator { color: #f9a8d4; }
html.theme-dark .sql-editor-cm :is(.cm-number, .cm-atom) { color: #fbbf24; }
html.theme-dark .sql-editor-cm .cm-string { color: #86efac; }
html.theme-dark .sql-editor-cm .cm-comment { color: #aab6c4; font-style: italic; }
html.theme-dark .sql-editor-cm .cm-variable-2 { color: #c4b5fd; }
html.theme-dark .sql-editor-cm :is(.cm-variable-3, .cm-builtin) { color: #67e8f9; }
html.theme-dark .sql-editor-cm .CodeMirror-matchingbracket {
  background: var(--app-accent-soft);
  color: #ffffff !important;
  outline: 1px solid var(--app-accent);
}
html.theme-dark ::-webkit-scrollbar { width: 10px; height: 10px; }
html.theme-dark ::-webkit-scrollbar-track { background: var(--app-bg); }
html.theme-dark ::-webkit-scrollbar-thumb {
  background: var(--app-border);
  border: 2px solid var(--app-bg);
  border-radius: 8px;
}
html.theme-dark ::-webkit-scrollbar-thumb:hover { background: #4b5d70; }