@import url("./global-config.css");

:root {
  --primary: rgb(49, 196, 110);
  --secondary: rgb(107, 82, 203);
  --tertiary: rgb(49, 196, 110);
  --success: rgb(52, 161, 110);
  --selected: rgb(255, 189, 46);
  --hint: rgb(254, 190, 45);
  --failure: rgb(255, 38, 92);
  --text: rgb(196, 198, 222);
  --text2: rgb(255, 255, 255);
  --text3: rgb(196, 198, 222);
  --text5: rgb(255, 255, 255);
  --textBtn: rgb(255, 255, 255);
  --border: rgb(77, 80, 128);
  --background1: rgb(31, 33, 65);
  --background2: rgb(11, 14, 48);
  --background3: rgb(5, 6, 30);
  --background4: rgb(107, 82, 203);
  --background5: rgb(29, 32, 82);

  --font-size: 14px;
  --padding-x: 17.45px;
  --m-header-height: 61px;
  --m-header-font-size: 18.4px;
  --m-account-body-background: rgb(22, 22, 22);
  --register-bg: ;
  --primary-filter: brightness(0) saturate(100%) invert(55%) sepia(80%) saturate(355%) hue-rotate(92deg) brightness(96%) contrast(101%);
  --text5-filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(723%) hue-rotate(190deg) brightness(110%) contrast(101%);
  --secondary-filter: brightness(0) saturate(100%) invert(37%) sepia(75%) saturate(549%) hue-rotate(211deg) brightness(89%) contrast(97%);
}
:root {
  --bg-opacity: 0;
  --bg-base-color: var(--primary);

  --bo-t: 0;
  --bo-l: 0;
  --bo-w: 100%;
  --bo-h: 2px;
  --bo-z: 1;
  --bo-opacity: 0;
  --bo-base-color: var(--border);
}

.ol-bg-dark {
  background: linear-gradient(0deg,
      rgba(0, 0, 0, var(--bg-opacity)) 0%,
      rgba(0, 0, 0, var(--bg-opacity)) 100%),
    var(--bg-base-color);
}

.ol-bg-light {
  background: linear-gradient(0deg,
      rgba(255, 255, 255, var(--bg-opacity)) 0%,
      rgba(255, 255, 255, var(--bg-opacity)) 100%),
    var(--bg-base-color);
}

.ol-bo-dark {
  position: relative;
}

.ol-bo-dark::after {
  content: "";
  position: absolute;
  width: var(--bo-w);
  height: var(--bo-h);
  top: var(--bo-t);
  left: var(--bo-l);
  z-index: var(--bo-z);
  background: linear-gradient(0deg,
      rgba(0, 0, 0, var(--bo-opacity)) 0%,
      rgba(0, 0, 0, var(--bo-opacity)) 100%),
    var(--bo-base-color);
}

.ol-bo-light {
  position: relative;
}

.ol-bo-light::after {
  content: "";
  position: absolute;
  width: var(--bo-w);
  height: var(--bo-h);
  top: var(--bo-t);
  left: var(--bo-l);
  z-index: var(--bo-z);
  background: linear-gradient(0deg,
      rgba(255, 255, 255, var(--bo-opacity)) 0%,
      rgba(255, 255, 255, var(--bo-opacity)) 100%),
    var(--bo-base-color);
}

/**
  color system classes end
*/