/* g6m-credits-txn-card-v524
   Compact Cyber Neon wallet rail for DBTech Credits activity rows.
   V543: stack amount + solde so large balances (3M+) never clip the sidebar.
*/

:root {
	--g6m-txn-accent: #b56cff;
	--g6m-txn-accent-2: #ff2d95;
	--g6m-txn-gain: #5dff9a;
	--g6m-txn-gain-2: #1faa5a;
	--g6m-txn-loss: #ff6b7a;
	--g6m-txn-loss-2: #c62840;
	--g6m-txn-muted: rgba(210, 198, 235, 0.62);
	--g6m-txn-ease: 250ms cubic-bezier(0.22, 1, 0.36, 1);
	--g6m-txn-radius: 18px;
}

/* Kill bulky V483 icon / stacked layout leftovers */
html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card))::before,
html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card))::after {
	content: none !important;
	display: none !important;
}

/* Meta column — room for large balances (e.g. 3 000 979 GTA$) without kissing sidebar */
html body .structItem-cell--transaction-meta,
html body .structItem .structItem-cell--transaction-meta {
	width: min(15.5rem, 32%) !important;
	min-width: 12.5rem !important;
	max-width: 16.5rem !important;
	flex: 0 0 auto !important;
	margin-left: 1rem !important;
	margin-right: 0.35rem !important;
	padding: 0 !important;
	white-space: normal !important;
	overflow: hidden !important;
	text-overflow: unset !important;
	vertical-align: middle !important;
	align-self: center !important;
	box-sizing: border-box !important;
}

/* Compact glass rail — V543: stack amount + solde so large numbers fit */
html body .structItem-cell--transaction-meta .g6m-txn-card,
html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	gap: 0.55rem !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0.5rem 0.6rem 0.5rem 0.45rem !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	background:
		linear-gradient(135deg, rgba(28, 14, 42, 0.72), rgba(12, 8, 20, 0.82)),
		rgba(10, 8, 18, 0.55) !important;
	background-image:
		linear-gradient(135deg, rgba(181, 108, 255, 0.1), rgba(255, 45, 149, 0.04) 55%, transparent),
		linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 70%) !important;
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	border: 1px solid rgba(181, 108, 255, 0.28) !important;
	border-radius: var(--g6m-txn-radius) !important;
	box-shadow:
		0 6px 18px rgba(0, 0, 0, 0.28),
		0 0 0 1px rgba(255, 255, 255, 0.03) inset !important;
	transition:
		transform var(--g6m-txn-ease),
		border-color var(--g6m-txn-ease),
		box-shadow var(--g6m-txn-ease) !important;
	animation: none !important;
	position: relative !important;
}

/* When enhanced card exists, cell is a transparent shell */
html body .structItem-cell--transaction-meta:has(> .g6m-txn-card) {
	display: block !important;
	background: transparent !important;
	background-image: none !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
}

html body .structItem-cell--transaction-meta .g6m-txn-card:hover,
html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)):hover {
	transform: scale(1.015) !important;
	border-color: rgba(181, 108, 255, 0.48) !important;
	box-shadow:
		0 8px 22px rgba(0, 0, 0, 0.32),
		0 0 18px rgba(181, 108, 255, 0.16),
		0 0 0 1px rgba(255, 255, 255, 0.04) inset !important;
}

html body .structItem-cell--transaction-meta:has(> .g6m-txn-card):hover {
	transform: none !important;
	border-color: transparent !important;
	box-shadow: none !important;
}

/* Discreet 34px badge — wallet SVG */
html body .g6m-txn-card__icon {
	content: none !important;
	flex: 0 0 34px !important;
	width: 34px !important;
	height: 34px !important;
	min-width: 34px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	background:
		radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.18), transparent 55%),
		linear-gradient(145deg, rgba(181, 108, 255, 0.55), rgba(255, 45, 149, 0.35)) !important;
	border: 1px solid rgba(255, 255, 255, 0.14) !important;
	box-shadow: 0 0 10px rgba(181, 108, 255, 0.22) !important;
	font-size: 0 !important;
	line-height: 0 !important;
	color: transparent !important;
	transition: transform var(--g6m-txn-ease), box-shadow var(--g6m-txn-ease) !important;
}

html body .g6m-txn-card__icon::before {
	content: "" !important;
	display: block !important;
	width: 16px !important;
	height: 16px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4 8.5A2.5 2.5 0 0 1 6.5 6h11A2.5 2.5 0 0 1 20 8.5v7A2.5 2.5 0 0 1 17.5 18h-11A2.5 2.5 0 0 1 4 15.5v-7z' stroke='%23ffffff' stroke-width='1.8'/%3E%3Cpath d='M14.5 12.25h3.2a1.25 1.25 0 0 0 0-2.5H14.5' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='16.2' cy='11' r='0.9' fill='%23ffffff'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 16px 16px !important;
}

html body .g6m-txn-card:hover .g6m-txn-card__icon {
	transform: scale(1.05) !important;
	box-shadow: 0 0 14px rgba(181, 108, 255, 0.32) !important;
}

/* Hide old separator */
html body .g6m-txn-card__sep {
	display: none !important;
}

/* Rail: amount on top, solde below — survives million-scale balances */
html body .g6m-txn-card__body,
html body .g6m-txn-card__rail {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	max-width: 100% !important;
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	justify-content: center !important;
	gap: 0.35rem !important;
	margin: 0 !important;
	width: auto !important;
}

html body .g6m-txn-card__row {
	display: contents !important;
}

/* Hide "Montant" label — capsule is self-explanatory */
html body .g6m-txn-card__row:first-child > .g6m-txn-card__label,
html body .structItem-cell--transaction-meta > dl.pairs:first-of-type > dt {
	display: none !important;
}

html body .g6m-txn-card__label,
html body .structItem-cell--transaction-meta dl.pairs > dt {
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
	float: none !important;
	color: var(--g6m-txn-muted) !important;
	font-family: Rajdhani, "Segoe UI", sans-serif !important;
	font-size: 0.62rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	line-height: 1.1 !important;
}

/* Relabel balance dt → SOLDE */
html body .structItem-cell--transaction-meta > dl.pairs:last-of-type > dt {
	font-size: 0 !important;
	letter-spacing: 0 !important;
}

html body .structItem-cell--transaction-meta > dl.pairs:last-of-type > dt::after,
html body .g6m-txn-card__row:last-child > .g6m-txn-card__label {
	content: "Solde" !important;
	display: block !important;
	font-size: 0.62rem !important;
	letter-spacing: 0.12em !important;
	color: var(--g6m-txn-muted) !important;
	font-family: Rajdhani, "Segoe UI", sans-serif !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
}

html body .g6m-txn-card__row:last-child > .g6m-txn-card__label {
	content: none !important;
	font-size: 0.62rem !important;
}

/* Balance wrap (enhanced markup) */
html body .g6m-txn-card__balance-wrap {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: center !important;
	gap: 0.08rem !important;
	min-width: 0 !important;
	max-width: 100% !important;
	flex: 0 0 auto !important;
	text-align: left !important;
	margin-left: 0 !important;
	width: 100% !important;
}

html body .g6m-txn-card__balance-wrap .g6m-txn-card__label {
	font-size: 0.62rem !important;
}

/* Amount premium capsule — primary signal */
html body .g6m-txn-card__amount,
html body .g6m-txn-card__amount a,
html body .structItem-cell--transaction-meta > dl.pairs:first-of-type > dd a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0.15rem !important;
	margin: 0 !important;
	padding: 0.28rem 0.55rem !important;
	border-radius: 999px !important;
	font-family: Rajdhani, "Segoe UI", sans-serif !important;
	font-size: 0.84rem !important;
	font-weight: 800 !important;
	letter-spacing: 0.01em !important;
	line-height: 1.15 !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	color: #eafff2 !important;
	-webkit-text-fill-color: #eafff2 !important;
	background: linear-gradient(135deg, var(--g6m-txn-gain-2), #2fd67a 45%, var(--g6m-txn-gain)) !important;
	border: 1px solid rgba(93, 255, 154, 0.45) !important;
	box-shadow: 0 0 12px rgba(47, 214, 122, 0.22) !important;
	transition: box-shadow var(--g6m-txn-ease), filter var(--g6m-txn-ease) !important;
	flex: 0 1 auto !important;
	align-self: flex-start !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

html body .g6m-txn-card__amount--loss,
html body .g6m-txn-card__amount--loss a,
html body .structItem.is-deleted .structItem-cell--transaction-meta > dl.pairs:first-of-type > dd a {
	color: #fff5f6 !important;
	-webkit-text-fill-color: #fff5f6 !important;
	background: linear-gradient(135deg, var(--g6m-txn-loss-2), #e2475a 45%, var(--g6m-txn-loss)) !important;
	border-color: rgba(255, 107, 122, 0.5) !important;
	box-shadow: 0 0 12px rgba(226, 71, 90, 0.22) !important;
}

html body .g6m-txn-card__amount--gain {
	/* default gain styles already applied */
}

/* Balance — secondary; wraps cleanly for large figures */
html body .g6m-txn-card__balance,
html body .g6m-txn-card__balance a,
html body .structItem-cell--transaction-meta > dl.pairs:last-of-type > dd a {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	background-image: none !important;
	box-shadow: none !important;
	filter: none !important;
	font-family: Rajdhani, Orbitron, "Segoe UI", sans-serif !important;
	font-size: 0.86rem !important;
	font-weight: 750 !important;
	letter-spacing: 0 !important;
	line-height: 1.2 !important;
	color: #e8d7ff !important;
	-webkit-text-fill-color: #e8d7ff !important;
	text-decoration: none !important;
	white-space: normal !important;
	overflow-wrap: anywhere !important;
	word-break: break-word !important;
	text-align: left !important;
	max-width: 100% !important;
}

html body .structItem-cell--transaction-meta dl.pairs,
html body .g6m-txn-card dl.pairs {
	border: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	margin: 0 !important;
}

html body .structItem-cell--transaction-meta dl.pairs > dd,
html body .g6m-txn-card dl.pairs > dd {
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
	float: none !important;
	text-align: inherit !important;
}

/* Stock markup fallback: single horizontal row of two dls */
html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 0.55rem !important;
}

html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) > dl.pairs {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.1rem !important;
	width: auto !important;
	flex: 0 1 auto !important;
}

html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) > dl.pairs:first-of-type {
	align-items: flex-start !important;
}

html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) > dl.pairs:last-of-type {
	align-items: flex-end !important;
	margin-left: auto !important;
}

/* Activity stays primary — don't let meta steal focus */
html body .structItem--transaction .structItem-title,
html body .structItem.structItem--transaction .structItem-title,
html body [data-template*="dbtech_credits"] .structItem-title {
	font-size: 1.05rem !important;
	font-weight: 750 !important;
}

html body [data-template*="dbtech_credits"] .structItem {
	align-items: center !important;
}

/* Laptop */
@media (max-width: 1200px) {
	html body .structItem-cell--transaction-meta,
	html body .structItem .structItem-cell--transaction-meta {
		width: min(14rem, 34%) !important;
		min-width: 11rem !important;
		max-width: 15rem !important;
		margin-left: 0.75rem !important;
	}

	html body .g6m-txn-card__amount,
	html body .structItem-cell--transaction-meta > dl.pairs:first-of-type > dd a {
		font-size: 0.78rem !important;
		padding: 0.24rem 0.5rem !important;
	}

	html body .g6m-txn-card__balance,
	html body .structItem-cell--transaction-meta > dl.pairs:last-of-type > dd a {
		font-size: 0.8rem !important;
	}
}

/* Tablet — still inline when possible */
@media (max-width: 900px) {
	html body .structItem-cell--transaction-meta,
	html body .structItem .structItem-cell--transaction-meta {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		flex: 1 1 100% !important;
		margin-left: 0 !important;
		margin-top: 0.55rem !important;
	}

	html body .structItem-cell--transaction-meta .g6m-txn-card,
	html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) {
		width: 100% !important;
	}

	html body .g6m-txn-card:hover,
	html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)):hover {
		transform: scale(1.01) !important;
	}
}

/* Mobile — stack under activity, keep rail aligned */
@media (max-width: 560px) {
	html body .g6m-txn-card__icon {
		width: 32px !important;
		height: 32px !important;
		min-width: 32px !important;
		flex-basis: 32px !important;
	}

	html body .structItem-cell--transaction-meta .g6m-txn-card,
	html body .structItem-cell--transaction-meta:not(:has(> .g6m-txn-card)) {
		padding: 0.4rem 0.5rem !important;
		gap: 0.45rem !important;
	}

	html body .g6m-txn-card__amount,
	html body .structItem-cell--transaction-meta > dl.pairs:first-of-type > dd a {
		font-size: 0.82rem !important;
		padding: 0.24rem 0.55rem !important;
	}

	html body .g6m-txn-card__balance,
	html body .structItem-cell--transaction-meta > dl.pairs:last-of-type > dd a {
		font-size: 0.86rem !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	html body .structItem-cell--transaction-meta,
	html body .g6m-txn-card,
	html body .g6m-txn-card__icon,
	html body .g6m-txn-card__amount {
		transition: none !important;
		animation: none !important;
		transform: none !important;
	}
}