/* ==========================================================================
   PBGame Market & Inventory — dark/green card system
   ========================================================================== */

:root{
	--pb-accent:#4ace8e;
	--pb-accent-soft:rgba(74,206,142,.14);
	--pb-card-bg:#15151b;
	--pb-card-bg-2:#1b1b22;
	--pb-text:#fff;
	--pb-text-muted:#9ca0b8;
}

/* ---------- layout ---------- */
.pb-market-layout{display:flex;margin-top:10px;flex-direction:column;gap:16px}
.pb-market-list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

.pb-inventory-page{display:flex;flex-direction:column;gap:22px}
.pb-inventory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

@media(max-width:1400px){
	.pb-market-list,.pb-inventory-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
	.pb-market-list,.pb-inventory-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:500px){
	.pb-market-list,.pb-inventory-grid{grid-template-columns:1fr}
}

/* ---------- market card ---------- */
.pb-market-item{
	position:relative;
	display:flex;
	flex-direction:column;
	padding:13px;
	border:1px solid rgba(255,255,255,.075);
	border-radius:18px;
	background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 34%),var(--pb-card-bg);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 34px rgba(0,0,0,.20);
	cursor:pointer;
	overflow:hidden;
	transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

.pb-market-item:hover{
	border-color:var(--pb-accent);
	background:radial-gradient(circle at 50% 0,rgba(74,206,142,.16),rgba(74,206,142,0) 42%),linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 34%),var(--pb-card-bg);
	transform:translateY(-5px);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 54px rgba(0,0,0,.34),0 0 0 1px rgba(74,206,142,.12);
}

.pb-market-preview{
	position:relative;
	width:100%;
	aspect-ratio:1/1;
	border-radius:14px;
	border:1px solid rgba(255,255,255,.06);
	background:radial-gradient(circle at 50% 30%,rgba(70,80,140,.25),transparent),#0f0f14;
	display:flex;align-items:center;justify-content:center;
	overflow:hidden;
}

.pb-market-preview::after{
	content:"";
	position:absolute;
	inset:0;
	pointer-events:none;
	background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.55) 100%);
}

.pb-market-preview img,
.pb-market-preview-video{
	width:100%;height:100%;object-fit:cover;display:block;
	transition:transform .35s ease,filter .35s ease;
	opacity:0;
}

.pb-market-preview img.pb-lazy-loaded,
.pb-market-preview-video{opacity:1}
.pb-market-preview-video{opacity:1}

.pb-market-item:hover .pb-market-preview img,
.pb-market-item:hover .pb-market-preview-video{
	transform:scale(1.06);
	filter:saturate(1.08) contrast(1.03);
}

.pb-market-stock{
	position:absolute;
	z-index:2;
	top:10px;
	right:10px;
	background:rgba(11,12,15,.76);
	border:1px solid rgba(255,255,255,.08);
	color:var(--pb-accent);
	font-size:11px;
	font-weight:800;
	padding:5px 10px;
	border-radius:999px;
	backdrop-filter:blur(8px);
}

.pb-market-body{
	display:flex;
	flex-direction:column;
	gap:10px;
	padding-top:12px;
}

.pb-market-name{
	font-size:15px;
	font-weight:700;
	color:var(--pb-text);
	line-height:1.25;
	min-height:38px;
}

.pb-market-footer{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
}

.pb-market-price{
	font-size:19px;
	font-weight:900;
	color:var(--pb-accent);
	line-height:1;
}
.pb-market-price span{color:var(--pb-accent)}

.pb-market-buy{
	position:relative;
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:center;
	width:48px;
	height:48px;
	border:0;
	border-radius:16px;
	background:radial-gradient(circle at 50% 0,rgba(255,255,255,.36),transparent 34%),linear-gradient(135deg,#4ace8e,#2faf73);
	color:#11151a;
	box-shadow:0 12px 24px rgba(74,206,142,.24),inset 0 1px 0 rgba(255,255,255,.28);
	cursor:pointer;
	overflow:hidden;
	transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}

.pb-market-buy:hover{
	transform:translateY(-2px);
	background:radial-gradient(circle at 50% 0,rgba(255,255,255,.42),transparent 36%),linear-gradient(135deg,#5be5a2,#35bf80);
	box-shadow:0 16px 30px rgba(74,206,142,.32),inset 0 1px 0 rgba(255,255,255,.30);
}

.pb-market-buy svg{
	width:18px!important;
	height:18px!important;
	min-width:18px!important;
	min-height:18px!important;
	max-width:18px!important;
	max-height:18px!important;
	flex:none!important;
	display:block!important;
	position:relative!important;
	inset:auto!important;
	top:auto!important;
	left:auto!important;
	right:auto!important;
	bottom:auto!important;
	transform:none!important;
	margin:0!important;
	padding:0!important;
}

/* purchased / sold states */
.pb-market-item.dc-purchased{
	opacity:.55;
	filter:grayscale(60%);
}
.pb-market-item.dc-purchased .pb-market-buy{
	background:linear-gradient(135deg,#555,#3b3b3b)!important;
	box-shadow:none!important;
	color:#cfd2e0;
	cursor:not-allowed;
}
.pb-market-item.dc-sold{
	opacity:.5;
	pointer-events:none;
}

/* ---------- inventory card ---------- */
.pb-inventory-item{
	position:relative;
	display:flex;
	flex-direction:column;
	gap:12px;
	padding:13px;
	border:1px solid rgba(255,255,255,.075);
	border-radius:18px;
	background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 34%),var(--pb-card-bg);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 34px rgba(0,0,0,.20);
	cursor:pointer;
	overflow:hidden;
	min-width:0;
	transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

.pb-inventory-item:hover{
	transform:translateY(-5px);
	border-color:rgba(74,206,142,.5);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 54px rgba(0,0,0,.34);
}

.pb-inventory-item.active{
	border-color:var(--pb-accent);
	background:radial-gradient(circle at 50% 0,rgba(74,206,142,.16),rgba(74,206,142,0) 42%),linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 34%),var(--pb-card-bg);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 22px 44px rgba(0,0,0,.26),0 0 0 1px rgba(74,206,142,.24);
}

.pb-inventory-item-preview{
	position:relative;
	height:220px;
	border-radius:14px;
	border:1px solid rgba(255,255,255,.06);
	background:radial-gradient(circle at 50% 30%,rgba(70,80,140,.25),transparent),#0f0f14;
	display:flex;align-items:center;justify-content:center;
	overflow:hidden;
	padding:14px;
}

.pb-inventory-item-preview img{
	max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;
	opacity:0;transition:opacity .3s ease;
}
.pb-inventory-item-preview img.pb-lazy-loaded{opacity:1}
.pb-inventory-preview-video{width:100%;height:100%;object-fit:cover;display:block;border-radius:10px}

.pb-inventory-item-status{
	position:absolute;
	z-index:2;
	top:10px;
	right:10px;
	padding:5px 10px;
	border-radius:999px;
	background:rgba(11,12,15,.76);
	border:1px solid rgba(255,255,255,.08);
	font-size:11px;
	letter-spacing:.04em;
	text-transform:uppercase;
	color:#c9cde2;
	font-weight:800;
	backdrop-filter:blur(8px);
}
.pb-inventory-item.active .pb-inventory-item-status{
	background:rgba(74,206,142,.16);
	border-color:rgba(74,206,142,.4);
	color:var(--pb-accent);
}

.pb-inventory-item-name{
	font-size:15px;
	line-height:1.25;
	color:var(--pb-text);
	font-weight:700;
	word-break:break-word;
	padding:0 2px;
}

@media(max-width:500px){
	.pb-inventory-item-preview{height:200px}
}

/* ---------- category tabs ---------- */
ul.pb-market-categories.vertical-navigation{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
	margin:0 0 18px;
	padding:6px;
	list-style:none;
	overflow-x:auto;
	overflow-y:hidden;
	border-radius:16px;
    background: linear-gradient(1deg, #25252e 30%, #292932 100%);
}

ul.pb-market-categories.vertical-navigation::-webkit-scrollbar{height:4px}
ul.pb-market-categories.vertical-navigation::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:999px}

ul.pb-market-categories.vertical-navigation li{
	list-style:none;
	border:0;
	flex:0 0 auto;
}

ul.pb-market-categories.vertical-navigation li a{
	display:flex;
	align-items:center;
	gap:0;
	padding:11px 20px;
	border-radius:12px;
	background:transparent;
	border:1px solid transparent;
	color:var(--pb-text-muted);
	font-size:13px;
	font-weight:700;
	letter-spacing:.02em;
	text-transform:none;
	white-space:nowrap;
	transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease;
}

ul.pb-market-categories.vertical-navigation li a::before{
	content:none;
	display:none;
}

ul.pb-market-categories.vertical-navigation li a:hover{
	color:var(--pb-text);
	background:rgba(255,255,255,.05);
}

ul.pb-market-categories.vertical-navigation li a.active,
ul.pb-market-categories.vertical-navigation li.active a{
	color: #ffffff;
	background:linear-gradient(135deg,#4ace8e,#2faf73);
	border-color:transparent;
	box-shadow:0 10px 22px rgba(74,206,142,.28);
	padding:11px 20px;
}

@media(max-width:640px){
	ul.pb-market-categories.vertical-navigation{
		flex-wrap:nowrap;
		gap:6px;
	}
	ul.pb-market-categories.vertical-navigation li a{
		padding:10px 16px;
		font-size:12.5px;
	}
}