:root {
  --bg-light-gray: #F1F4F8;
}

.content {
  padding-right: 20px;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 1400px;
  width: 100%;
}

.rebate-stats {
    width: 573px;
    flex-direction: column;
}

.round-box {
    background-color: white;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 0px 1px 1px rgb(0 0 0 / 7%);
    margin: 3px;
}
.round-box .title {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 22px;
  color: #313E48;
  padding-bottom:20px;
  padding-top: 10px;
}

.form-control {
  appearance: auto;
  font-size: 14px;
  border: 1px solid #EBECEE !important;
  border-radius: 0.4rem !important;
}

.card {
  width: 377px;
  min-height: 162px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 15px;
  flex-grow: 1e;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: start;
}

.card .header-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  color: #7C858C;
}

.header .header-title .indicator {
  width: 4px;
  height: 42px;
  background-color: orange;
  border-radius: 2px;
}

.card-value {
  font-size: 48px;
  font-weight: 550;
  color: #333;
  margin-top: auto;
  padding-top: 10px;
}
.subtitle{
  font-size: 14px;
  margin-top: 5px;
}
.pb-7{
  padding-bottom: 7px!important;
}
.pb-0{
  padding-bottom: 0px!important;
}
.prevent-select {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

.align-center {
  text-align: center;
}
.align-right {
  text-align: right;
}

.btn-primary {
  color: #fff;
  background-color: #FFFFFF;
  border-color: #EBECEE;

  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #313E48;
}
/* tooltipz container */
.tooltipz {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* tooltipz text */
.tooltipz .tooltipztext {
  visibility: hidden;
  background-color: #565656d4;
  color: #fff;
  text-align: center;
  padding: 10px;
  border-radius: 6px;

  position: absolute;
  z-index: 1;
  bottom: 100%;
  font-size: 12px;
  white-space: nowrap;
  left: 50%;
  transform: translateX(-50%);
}

/* Show the tooltipz text when you mouse over the tooltipz container */
.tooltipz:hover .tooltipztext {
  visibility: visible;
}
.plotly .sankey-node text {
    stroke: none !important;
    text-shadow: none !important;
}