/*================================================================================
	Item Name: Modern Admin - Clean Bootstrap 4 Dashboard HTML Template
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
html body .pace .pace-progress {
    background: #3333ff !important;
}

.avatar-title {
	width: max-content;
	font-size: 5.5rem;
	line-height: 0.2;	
}
.label {
	padding: 10px;
	font-size: 18px;
	color: #111;
}
.copy-text {
	position: relative;
	padding: 10px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 10px;
	display: flex;
}
.copy-text input.text {
	padding: 10px;
	font-size: 35px;
	color: #555;
	border: none;
	outline: none;
}
.copy-text button {
	padding: 10px;
	background: #5784f5;
	color: #fff;
	font-size: 18px;
	border: none;
	outline: none;
	border-radius: 10px;
	cursor: pointer;
}

.copy-text button:active {
	background: #809ce2;
}
.copy-text button:before {
	content: "Copied";
	position: absolute;
	top: -45px;
	right: 0px;
	background: #5c81dc;
	padding: 8px 10px;
	border-radius: 20px;
	font-size: 15px;
	display: none;
}
.copy-text button:after {
	content: "";
	position: absolute;
	top: -20px;
	right: 25px;
	width: 10px;
	height: 10px;
	background: #5c81dc;
	transform: rotate(45deg);
	display: none;
}
.copy-text.active button:before,
.copy-text.active button:after {
	display: block;
}
.table-profile tbody tr td{
	 font-size: x-large;
}
.table-profile tbody tr td:last-child{
	font-weight: 900;
}
.table-profile tbody tr td:first-child{
	font-weight: 300;
}
#card-tab-trx  .card {
    height: 450px !important;
}
#card-tab-amount .card {
    height: 520px !important;
}
.btn-delete{
	box-shadow: none;
	color: #3333FF;
}

.action-tab{
	display: flex;
}

.icon-display{
	color: #3333FF;
	padding: 10px;
	/* flex: 1; */
}

.icon-display a{
	color: #3333FF;
}

.navbar-nav .navbar-brand{
	padding: 5px 0px !important;
}


.logo {
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -0.5px;
}

.balance-container {
	display: flex;
	align-items: center;
	gap: 30px;
}

.balance-card {
	background: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	padding: 5px 20px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	transition: all 0.3s ease;
}

.balance-card:hover {
	background: rgba(255, 255, 255, 0.25);
	transform: translateY(-2px);
}

.balance-label {
	font-size: 9px;
	opacity: 0.9;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 4px;
}

.balance-amount {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -1px;
}

.currency {
	font-size: 16px;
	opacity: 0.9;
	margin-left: 4px;
}

.user-menu {
	display: flex;
	align-items: center;
	gap: 12px;
	cursor: pointer;
	padding: 8px 16px;
	border-radius: 50px;
	transition: background 0.3s ease;
}

.user-menu:hover {
	background: rgba(255, 255, 255, 0.1);
}

.avatar {
	border-radius: 50%;
	background: linear-gradient(135deg, #c2cffb 0%, #a6c1ee 100%);
	font-weight: 600;
	font-size: 16px;
	border: 2px solid rgba(255, 255, 255, 0.5);
}

.avatar-profile{
	border-radius: 50%;
	background: linear-gradient(135deg, #c2cffb 0%, #a6c1ee 100%);
	font-weight: 600;
	font-size: 45px;
	border: 2px solid rgba(255, 255, 255, 0.5);
}

.avatar-profile{
	width: 90px;
	height: 90px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
}

.header-navbar .logo {
	color: #1a202c;
}

.header-navbar .balance-card {
	background: #f7fafc;
	border: 1px solid #e2e8f0;
	color: #1a202c;
}

.header-navbar .balance-amount {
	color: #667eea;
}

.header-navbar .avatar, .avatar-profile {
	background: linear-gradient(135deg, #667eea 0%, #4b51a2 100%);
	color: white;
}

.header-navbar .user-name {
	color: #4a5568;
}

@media (max-width: 768px) {

	.balance-container {
		width: 100%;
		justify-content: center;
	}

	.balance-amount {
		font-size: 24px;
	}
}

.dt-buttons.btn-group .btn{
	background-color: #3333FF !important;
}

#transactions-list-datatable_wrapper .justify-content-between div:nth-child(2){
	display: contents;
}

.transactions-hero-card {
	background: linear-gradient(135deg, #ffffffff, #ffffffff);
	border: none;
	color: #fff;
	border-radius: 1.2rem;
}
.transactions-hero-card h1 {
	font-weight: 600;
	margin-bottom: .15rem;
}
.transactions-hero-card p {
	color: #111827;
	margin-bottom: 0;
	font-size: 1rem;
	opacity: .92;
}
.transactions-summary-card {
	border-radius: 1rem;
	border: 1px solid #eef2f7;
	/* box-shadow: 0 12px 24px rgba(15, 23, 42, .08); */
	transition: all .25s ease;
}
.transactions-summary-card:hover {
	box-shadow: 0 15px 30px rgba(0, 0, 0, .05);
	transition: all .25s ease;
}
.transactions-summary-card .label {
	text-transform: uppercase;
	font-size: .95rem;
	letter-spacing: .08rem;
	color: #8c93ad;
}
.transactions-summary-card .value {
	font-size: 2rem;
	font-weight: 700;
	color: #111827;
}
.transactions-filters-card {
	border-radius: 1rem;
	border: 1px solid #eef2f7;
	padding: 1rem 1.2rem;
	background: #fff;
}
.transactions-filters-card label {
	font-size: .82rem;
	letter-spacing: .05rem;
	font-weight: 600;
	color: #6b7280;
}
.transactions-filters-card .form-control,
.transactions-filters-card .custom-select {
	border-radius: 999px;
}
.transactions-table table {
	border-radius: 1rem;
	overflow: hidden;
}
.transactions-table .badge-success {
	background: #d1fae5;
	color: #047857;
}
.transactions-table .badge-danger {
	background: #fee2e2;
	color: #b91c1c;
}
.transactions-table td,
.transactions-table th {
	vertical-align: middle;
}