body{
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  font-size: 14px;
  /* color: red; */
  -ms-overflow-style: none;
  scrollbar-width: none;
  overflow-y: scroll;
  margin-bottom: 0px;
  margin-top: 5px;
  background-color: #E3E4E9;
}

body::-webkit-scrollbar {
  display: none;
}

input {
  color-scheme: dark;
}
/* Убираем стрелочки в input[type="number"] */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none; // Yeah, yeah everybody write about it
}

input[type='number'],
input[type="number"]:hover,
input[type="number"]:focus {
    appearance: none;
    -moz-appearance: textfield;
}



label{
  color: #000000;
}

input {
  background-color: #d2d1d6;
  color: #000000;
  border: 1px;
  border-radius: 2px;
}

select {
  min-width: 130px;
  background-color: #282e31;
  color: #e6e9f0;
  border: 1px;
  border-radius: 2px;
  padding-block: 1px;
  padding-inline: 2px;
}

button{
  background: #e6e9f0;
  color: #2f3436;
  min-height: 22px;
}

.overlay {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  height: 99vh;
}

.header {
  display:flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2px;
  border-bottom: 1px solid DimGray;
  padding-bottom: 2px;
}

.ag-theme-alpine-dark{
  --ag-background-color: #E3E4E9 !important;
  --ag-foreground-color: #000000 !important;
  --ag-odd-row-background-color: #D9DADF !important;
  --ag-border-color: #AFB0B5 !important;
  --ag-secondary-border-color: #D8D9E5 !important;
  
  --ag-header-background-color: #D9DADF !important;
  --ag-subheader-background-color: #FFFFFF !important;
}

.table-grid{
  touch-action: manipulation;
}

.ag-select-list {
    max-height: 150px !important;
}

.ag-header-cell-label {
    justify-content: center;
}

.default-header {
    color: #000000 !important;
}
.bold-header {
    font-weight: 600;
}
.midbold-header {
    font-weight: 550;
}
.ruonia-header {
    color: #1198e8 !important;
}
.ruonia-price-header {
    color: #1198e8 !important;
    font-weight: 550;
}
.ruonia-3m-header {
    color: #15a8a8 !important;
}
.keyrate-header {
    color: #c37e00 !important;
}
.keyrate-price-header {
    color: #c37e00 !important;
    font-weight: 550;
}

.vertical-header {
  writing-mode: vertical-rl;
  -ms-writing-mode: tb-lr;

  rotate: 180deg;
  height: 100%;
  font-size: 12px;
}

.price-header {
    color: #4D3DD1 !important;
    /* font-size: 17px; */
}

.yield-header {
    color: #935548 !important;
    /* font-size: 17px; */
}

.active-header {
    color: #d33b3b !important;
}

.wrong-number {
  color: #E82F13;
  text-align: right;
}
.right-number {
  color: #2387D2;
  text-align: right;
}

@keyframes flashTradersStocks {
    0% {background: #fff0;}
    50% {background: #1a53c185;}
    100% {background: #1a53c145;}
}
.flash-traders-stocks {
  /* background: linear-gradient(to left, #333, #333 50%, #eee 75%, #333 75%); */
  /* background: linear-gradient(to right, #1a53c100, #1a53c100 25%, #1a53c145 75%, #1a53c100 100%); */
  /* border-right: 2px solid white !important; */
  animation: flashTradersStocks 2s cubic-bezier(0.42, 0, 1, 1) 1;
  animation-fill-mode: forwards;
  padding-right: 6px !important;
}
.flash-traders-stocks::after{
  animation: flashTradersStocks 1.5s cubic-bezier(0.42, 0, 1, 1) 1;
  animation-fill-mode: forwards;
  /* content: " 🞀"; */
}

/* .flash-traders-stocks::before{
  content: "🞂 ";
  color: rgb(243, 192, 139);
} */


@keyframes fadeBackgroundRed {
    from {color: red;}
    to {}
}
@keyframes fadeBackgroundGreen {
    from {color: #7FFF00;}
    to {}
}

.flash-red{
  animation: fadeBackgroundRed 3s cubic-bezier(0.42, 0, 1, 1);
  animation-fill-mode: forwards;
}
.flash-green{
  animation: fadeBackgroundGreen 3s cubic-bezier(0.42, 0, 1, 1);
  animation-fill-mode: forwards;
}

@keyframes flashRowEven {
    /* from {background-color: #484428;} */
    /* to {background-color: #2B301C;} */
    from {background-color: #D2ED73;}
    to {background-color: #AFCC4C;}
}
.flash-row-even{
  animation: flashRowEven 1s cubic-bezier(0.42, 0, 1, 1) !important;
  animation-fill-mode: forwards !important;
}
@keyframes flashRowOdd {
    from {background-color: #BBD367;}
    to {background-color: #9AB738;}

}
.flash-row-odd{
  animation: flashRowOdd 1s cubic-bezier(0.42, 0, 1, 1) !important;
  animation-fill-mode: forwards !important;
}


.tabs {
  display: flex;
  padding-left: 30px;
  padding-right: 30px;
  margin-bottom: -2px;
}

.tab-button {
  min-width: 100px;
  border-radius: 20px 7px 0px 0;
  color: #858687;
  background-color: #d3d2d7;
  border: none;
  outline: none;
  cursor: pointer;
  /* padding: 5px 5px 2px 8px; */
  padding: 5px 5px;
  margin-left: 3px;
  transition: 0.3s;
  font-size: 13px;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}

.tab-button:hover {
  background-color: #B6B1B3;
}

.tab-button.active {
  color: #000000;
  background-color: #B6B1B3;
  font-weight: 600;
}

.type-button {
  width: 60px;
  border-radius: 20px;
  /* color: #faf6ea; */
  background-color: #282e31;
  border: none;
  outline: none;
  cursor: pointer;
  margin-left: 3px;
  margin-bottom: 5px;
  transition: 0.3s;
  font-size: 13px;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}
.type-button.type-bid {
  color: rgb(122, 166, 218);
}
.type-button.type-ask {
  color: orange;
}

.type-button:hover {
  background-color: #454F54;
}
.type-button.active{
  font-weight: 600;
  background-color: #4F5445;
}

.stock-type-bid{
  color: #00619A;
}

.stock-type-ask{
  color: #C37E00;
}

.auction-tab{
  background-color: #18547b !important;
}

.auction-tab.active{
  background-color: #006ba8 !important;
}

.marquee{text-align:left;width:100%;overflow:hidden;white-space: nowrap;}
.marquee span {
  display:inline-block;
  text-indent:0;
  animation: marquee 1s linear infinite;
  transform: translate(calc(-100% + 35vw), 0);
}
.marquee span:hover{animation-play-state: paused}
@keyframes marquee {
0%  { transform: translate(0%, 0); }
100% { transform: translate(-50%, 0); }
}

.marquee-base{
  /* color: #fffff2; */
  border: 1px solid #68686d;
  border-radius: 12px 0px 0px 12px;
  width: 35vw;
  height: 20px;
  overflow:hidden;
  white-space: nowrap;
}
.marquee-in{
  color: #bdb085;
  margin-left: 4px;
  margin-right: 4px;
  border-radius: 12px 0px 0px 12px;
  width: 100%;
  height: 20px;
  overflow:hidden;
  white-space: nowrap;
}

.calc-base{
  color: rgb(169,186,42) !important;
}
.calc-input{
  width: 130px;
  color: #a7a49b;
  background-color: #282e31;
}
.calc-input:focus{
  color: #a7a49b !important;
}
.calc-date::-webkit-calendar-picker-indicator {
    filter: invert(50%);
}
.calc-base-I{
  color: grey !important;
}
.calc-base-ro{
  color: orange !important;
}
.calc-input-ro{
  width: 130px;
  color: orange;
}

/* Цвет иконки календаря в таблице (сделан хитрым способом через фильтры) */
.ag-date-field-input::-webkit-calendar-picker-indicator {
    filter: invert(50%) sepia(100%) hue-rotate(170deg);
}

.ag-right-aligned-header{
  color: #796629;
}


/* Цвет+изображение индикатора активности пользователя */
.user-unknown::after{
  zoom:40%;
  display: flex;
  flex-wrap: nowrap;
  justify-content:center;
  align-items:center;
  content: url("/images/gray.png");
  height: 108px;
}
.user-active::after{
  zoom:40%;
  display: flex;
  flex-wrap: nowrap;
  justify-content:center;
  align-items:center;
  content: url("/images/green.png");
  height: 108px;
}
.user-unactive::after{
  zoom:40%;
  display: flex;
  flex-wrap: nowrap;
  justify-content:center;
  align-items:center;
  content: url("/images/red.png");
  height: 108px;
}

/* Отображение существования запросов */
.mid-col-default{
  color: #163A0E;
  text-align: "right";
}
.mid-offer{
  color: rgb(255,144,65);
}

.buygreen-col{
  color: rgb(52,201,36);
  text-align: right;
}
.sellred-col{
  color: rgb(255,76,91);
  text-align: right;
}

@keyframes OfferRowOdd {
    from {background-color: #222628}
    /*to {background-color: #313521;}*/
    to {background-color: #727637}
}
.offer-row-odd{
  animation: OfferRowOdd 1s cubic-bezier(0.42, 0, 1, 1) !important;
  animation-fill-mode: forwards !important;
}

@keyframes OfferRowEven {
    from {background-color: #181d1f}
    /*to {background-color: #313521;}*/
    to {background-color: #56592f}
}
.offer-row-even{
  animation: OfferRowEven 1s cubic-bezier(0.42, 0, 1, 1) !important;
  animation-fill-mode: forwards !important;
}

/* Отображение повторения запроса */

@keyframes RepeatedOffer {
    from {background-color: aliceblue}
    /*to {background-color: #313521;}*/
    to {background-color: #00000000}
}
.repeated-offer{
  animation: RepeatedOffer 3s cubic-bezier(0.42, 0, 1, 1) !important;
  animation-fill-mode: forwards !important;
}

/* Отображение произведенной сделки */
@keyframes HadTrade {
    from {background-color: rgb(255,144,65)}
    /*to {background-color: #313521;}*/
    to {background-color: #00000000}
}
.mid-had-trade{
  animation: HadTrade 1s cubic-bezier(0.42, 0, 1, 1) !important;
  animation-fill-mode: forwards !important;
  animation-iteration-count: infinite !important;
}

/* Сортировка агрегирующей таблицы */
.agg-sort {
  margin-left: 4px;
}

/* Работа попапов */
.popup-window {display: none; position: fixed; z-index: 5; width:100%; height:100%; top: 0; left: 0; justify-content: flex-start; flex-direction: row-reverse;}
.popup-frame { background-color: white; z-index: 10; min-width:800px;}
.popup-frame-broker { background-color: white; z-index: 10; min-width:1130px;}
.popup-frame iframe { width: 100%; height: 100%; border: 0;}
.popupdarkbg { position: fixed; z-index: 5; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; background-color: rgba(0,0,0,.75); display: none; }
.popup-header-text {color: #fffff2; font-weight: 600;}

/* Вывод таблицы на печать*/
.header.print {display: none!important;}
.header-print {display: none;}
.header-print.print {
  display: flex;
  height: 25px;
}
.ag-theme-alpine-dark.print span {color: black!important;}
.ag-theme-alpine-dark.print div {color: black!important;}
.ag-theme-alpine-dark.print button {display: none;}
.ag-theme-alpine-dark.print{
  display: block !important;
  position: absolute !important;
  top: 58px !important;
  left: 3px !important;
  width: 98% !important;
  height: 98% !important;
  min-height: 50px !important;
  --ag-background-color: white !important;
  --ag-odd-row-background-color: white !important;
  --ag-border-color: #999 !important;
  --ag-secondary-border-color: #999 !important;
  --ag-foreground-color: #000!important;
  --ag-header-background-color: white !important;
  --ag-borders: none !important
}