
@use '../utils' as *;

/*----------------------------------------*/
/* investors css
/*----------------------------------------*/
.investors-table-wrapper {
    position: relative;
    z-index: 5;
	.coin-one {
		position: absolute;
		bottom: -120px;
		z-index: -1;
		inset-inline-end: 30%;
		@media #{$xs,$sm,$md} {
			bottom: -70px;
			max-width: 100px;
		}
		img {
			filter: drop-shadow(0px 4px 144px rgba(255, 216, 90, 0.25));
			width: 100%;
		}
	}
	.coin-two {
		position: absolute;
		top: -110px;
		inset-inline-start: 15%;
		z-index: -1;
		@media #{$xs,$sm,$md} {
			top: -50px;
			max-width: 100px;
		}
		img {
			filter: drop-shadow(0px 4px 144px rgba(255, 216, 90, 0.25));
			width: 100%;
		}
	}
	&.style-two {
		position: relative;
		top: 150px;
		margin-bottom: 150px;
	}
}

// investors-table
.investors-table  {
	table {
		--bs-table-bg: transparent;
		@media #{$xs,$sm} {
			min-width: 600px;
		} 
		thead {
			tr {
				th {
					color: rgba($white, $alpha: 0.8);
					font-size: 14px;
					font-weight: 600;
					border: 0;
					background: transparent;
				}
			}
		}
		tbody {
			tr {
				td {
					color: var(--td-white);
					padding: 8px 12px;
					vertical-align: middle;
					border-color: rgba($white, $alpha: 0.2);
					height: 56px;
				}
			}
		}
	}
}
.table-card {
    background: #252930;
	background-repeat: no-repeat;
  	background-size: 100% 100%;
    border: 2px solid rgba($white, $alpha: 0.05);
    border-radius: 20px;
    border-color: rgba($white, $alpha: 0.05);
    position: relative;
    box-shadow: 4px 7px 34px 0px rgba($black, $alpha: 0.25);
    overflow: hidden;
    padding: 35px 45px 40px;
	@media #{$xs} {
		padding: 25px 25px 20px;
	}
	.table-card-title {
		font-size: 18px;
		font-weight: 600;
		margin-bottom: 10px;
	}
}
.active-status {
	font-size: 10px;
	color: var(--td-white);
	font-weight: 600;
	position: relative;
	padding-inline-start: 11px;
	&:before {
		position: absolute;
		content: "";
		height: 5px;
		width: 5px;
		background-color: var(--td-retro-lime);
		top: 50%;
		transform: translateY(-50%);
		inset-inline-start: 0;
		border-radius: 50%;
	}
	&.warning {
		&::before {
			background-color: var(--td-warning);
		}
	}
}

