@font-face {
  font-family: "Montserrat-Regular";
  src: url("./fonts/Montserrat-Regular.ttf");
}

* {
  font-family: "Montserrat-Regular";
  padding: 0px;
  margin: 0px;
  user-select: none;
  outline: 0px;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none;
  box-sizing: border-box;
  --bg-color: #1d1e22;
  --item-bg-color: #25252c;
  --selected-color: #0f1013;
  --txt-heading-clr: white;
  --txt-description: #3b3d44;
  --txt-description-light: #494c53;
  --txt-highlight-editor: #27292e;
  --scroll-bar-btn: #2e3036;
  --scroll-bar-btn-hover: #3e4149;
  --header-bg: #16171a;
  --borders: #383a42;
  --txt-heading-highlighted: #64666b;
  --dialog-bg: #2c2e35;
  --icon-clr: white;
  --txt-full-light: white;
  --yes-theme: rgb(68, 202, 68);
  --no-theme: rgb(247, 56, 56);

  /*highlighted Colors*/
  --default-clr: #e2eb8c;
}

html,
body {
  background-color: var(--bg-color);
  padding: 0px;
  margin: 0px;
  overflow: hidden;
}

.container {
  display: flex;
  position: absolute;
  height: 100%;
  width: 100%;
  padding: 0px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0px;
  overflow: hidden;
  scroll-behavior: smooth;
}

.container > div.header {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  width: 100%;
  background-color: var(--header-bg);
  min-height: 70px;
}

::-webkit-scrollbar {
  background-color: transparent;
  width: 10px;
}

::-webkit-scrollbar-track {
  background: var(--bg-color);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: var(--scroll-bar-btn);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--scroll-bar-btn-hover);
}

.keyword {
  color: #569cd6;
}
.string {
  color: #ce9178;
}
.number {
  color: #b5cea8;
}
.comment {
  color: #6a9955;
  font-style: italic;
}
.function {
  color: #dcdcaa;
}
.variable {
  color: #85ccf3;
}
.operator {
  color: #d4d4d4;
}
.dottedFunc {
  color: rgb(255, 253, 108);
}

.stringClr {
  color: rgb(177, 75, 61);
}

.specialKeys {
  color: white;
}

.defaultText {
  color: var(--default-clr);
}
.CapitalLtrFunc {
  color: #6a9955;
}

.purpleKeyword {
  color: rgb(143, 45, 182);
}

.booleanClr {
  color: rgb(151, 151, 151);
  font-style: italic;
}

@media (max-width: 946px) {
}

.divider-line {
  flex-grow: 1;
}

/* Title Bar Css*/

div.title-bar {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background-color: var(--header-bg);
  -webkit-app-region: drag;
  top: 0px;
  height: 25px;
  width: 100%;
  z-index: 200;
}
div.title-bar > div.menus {
  display: flex;
  flex-direction: row;
}
div.title-bar > div.menus > div {
  transition: all 0.3s;
  margin-top: 10px;
  cursor: pointer;
  -webkit-app-region: no-drag;
}
div.title-bar > div.menus > div:hover {
  background-color: var(--scroll-bar-btn);
}
div.title-bar > div.menus > div > svg {
  height: 30px;
  width: 30px;
  padding: 6px;
  color: white;
  transition: all 0.3s;
}