/*
 * assets/css/frontend.css
 * File Version: 1
 */

.bm-inv-wrap{
	background:#000;
	color:#fff;
	border:1px solid rgba(255,255,255,.12);
	box-shadow:0 10px 30px rgba(0,0,0,.55);
	padding:18px;
	border-radius:16px;
	font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial;
	line-height:1.4;
}

.bm-inv-top{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-bottom:16px;
}

.bm-inv-card{
	flex:1 1 240px;
	background:#0f0f0f;
	border:1px solid rgba(255,255,255,.14);
	border-radius:14px;
	padding:14px;
	position:relative;
	overflow:hidden;
}

.bm-inv-card:before{
	content:"";
	position:absolute;
	inset:0;
	background: radial-gradient(circle at 10% 10%, rgba(239,68,68,.18), transparent 55%);
	pointer-events:none;
}

.bm-inv-card h3{
	margin:0 0 10px;
	font-size:16px;
	letter-spacing:.3px;
	color:#fff;
	position:relative;
	z-index:1;
}

.bm-inv-metric{
	display:flex;
	gap:12px;
	flex-wrap:wrap;
	position:relative;
	z-index:1;
}

.bm-inv-pill{
	background:rgba(255,255,255,.08);
	border:1px solid rgba(255,255,255,.12);
	border-radius:999px;
	padding:6px 10px;
	font-size:13px;
	white-space:nowrap;
}

.bm-inv-small{
	opacity:.85;
	font-size:12px;
	margin-top:10px;
	position:relative;
	z-index:1;
}

.bm-inv-section{ margin-top:18px; }

.bm-inv-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	margin:18px 0 8px;
}

.bm-inv-title{
	background:#000;
	border:1px solid rgba(255,255,255,.18);
	border-radius:10px;
	padding:10px 12px;
	font-weight:700;
	color:#ef4444;
	letter-spacing:.7px;
}

.bm-inv-sub{
	font-size:12px;
	opacity:.85;
}

.bm-inv-table{
	width:100%;
	border-collapse:collapse;
	overflow:hidden;
	border-radius:14px;
	border:1px solid rgba(255,255,255,.18);
	background:#0b0b0b;
}

.bm-inv-table th, .bm-inv-table td{
	padding:10px 10px;
	border-bottom:1px solid rgba(255,255,255,.10);
	text-align:right;
	font-size:13px;
}

.bm-inv-table th:first-child, .bm-inv-table td:first-child{ text-align:left; }

.bm-inv-table thead th{
	background:#111;
	font-weight:700;
	color:#fff;
}

.bm-inv-table tbody tr:hover td{
	background:rgba(255,255,255,.03);
}

.bm-inv-table tfoot td{
	font-weight:700;
	background:#0f0f0f;
	border-top:1px solid rgba(255,255,255,.16);
}

.bm-inv-profit{ color:#22c55e; font-weight:700; }
.bm-inv-loss{ color:#ef4444; font-weight:700; }

.bm-inv-bottom{
	margin-top:18px;
	padding-top:14px;
	border-top:1px solid rgba(255,255,255,.18);
	display:flex;
	flex-wrap:wrap;
	gap:12px;
}

.bm-inv-summary{
	flex:1 1 260px;
	background:#0f0f0f;
	border:1px solid rgba(255,255,255,.14);
	border-radius:14px;
	padding:14px;
}

.bm-inv-summary h4{
	margin:0 0 10px;
	font-size:14px;
	opacity:.9;
}

.bm-inv-big{
	font-size:18px;
	font-weight:800;
}

.bm-inv-foot{
	margin-top:10px;
	font-size:12px;
	opacity:.75;
}

@media (max-width:680px){
	.bm-inv-table th, .bm-inv-table td{ padding:8px 8px; }
	.bm-inv-title{ width:100%; text-align:center; }
	.bm-inv-head{ flex-direction:column; align-items:flex-start; }
}