/*            HEADER            */
.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  z-index: 2;
  width: 100%;
  padding: 15px 70px;
  align-items: center;
  gap: 30px; 
  background: #00000055;
}

.header img {
  height: 40px;
}

.header__coin-block,
.header__player-block {
  display: flex;
  align-items: center;
  gap: 10px;
}

.header__coin-count,
.header__player-name {
  font-size: 30px;
  color: var(--light-text);
}

.header__player-block,
.header__setting-block {
  cursor: pointer;
}

.header__info-block {
  cursor: pointer;
}

.icon-reviews {
  cursor: pointer;
}

.game_time {
  font-weight: 600;
  margin-left: 3px;
}

.info_game_time {
  font-size: 25px;
  font-weight: 500;
  color: var(--light-text);
  display: flex;
  align-items: center;
}

.img-time {
  margin-bottom: 5px;
  margin-right: 3px;
}
.div-reviews-2 {
  display: flex;
  justify-content: center;
  align-items: center;
  /* width: 70px;
  width: auto; */
  position: relative;
}

.div-reviews:hover .head-info {
  opacity: 1;
  top: 70px;
}

.div-reviews-2:hover .head-info {
  top: 70px;
}

.div-reviews {
  margin-left: auto;
}



.unit-info-text,
.head-info-text {
  color: var(--light-text);
}

.head-info {
  width: 300%;
  position: absolute;
  top: -100px;
  left: -65px;
  right: 65px;
  padding: 10px;
  background: linear-gradient(to right bottom, #ae7836, #702d24);
  z-index: -1;
  border-radius: 12px;
  /* display: flex; */
  /* justify-content: center; */
  /* align-items: center; */
  transition: 0.5s;
  /* line-height: 20px; */
}
.unit-info-text,
.head-info-text {
  display: inline;
  font-size: 14px;
}

.head-info::before {
  content: '!';
  font-size: 14px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: var(--light-text);
  width: 16px;
  height: 16px;
  border: 1px solid var(--light-text);
  border-radius: 10px;
  margin-right: 5px;
}

@media (max-width: 1000px) {
  .header {
    padding: 8px 30px;
  }

}
@media (max-width: 500px) {
  .header {
    padding: 5px 10px;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 10px;
  }
  .header img {
    height: 30px;
  }
  .header__coin-block {
    gap: 5px;
  }
  .header__coin-count {
    font-size: 20px;
  }
}