﻿@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

/* Scoped font - NEVER global */
.pz-page, .pz-page *, .pz-sidebar, .pz-sidebar *, .pz-main, .pz-main *, .pz-card, .pz-card * {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
}
.fa,.fas,.far,.fab,.fal,.fad,.fa-solid,.fa-regular,.fa-brands {
  font-family: 'Font Awesome 6 Free','Font Awesome 5 Free','FontAwesome' !important;
}
html { scroll-behavior: smooth; }
.snowflakes,.snowflake { display:none!important; }

/* Page wrapper */
.pz-page { display:flex; gap:0; margin-top:20px; margin-bottom:60px; align-items:flex-start; }

/* â”€â”€ SIDEBAR â”€â”€ */
.pz-sidebar { flex:0 0 270px; width:270px; background:#161622; border-radius:16px; padding:20px; position:sticky; top:20px; z-index:10; margin-right:20px; }
.pz-sidebar-title { display:flex; align-items:center; gap:8px; color:#fff; font-weight:700; font-size:16px; margin-bottom:20px; }
.pz-sidebar-title i { color:#757a9e; }
.pz-section { margin-bottom:22px; }
.pz-section-head { display:flex; align-items:center; gap:7px; color:#fff; font-weight:700; font-size:14px; margin-bottom:10px; }
.pz-section-head span.emoji { font-size:15px; }
.pz-input { width:100%; background:#1e1e30; border:1px solid rgba(255,255,255,0.08); border-radius:10px; color:#fff; padding:9px 12px 9px 34px; outline:none; font-size:13px; transition:border-color .2s; }
.pz-input:focus { border-color:#545873; }
.pz-input-wrap { position:relative; margin-bottom:8px; }
.pz-input-wrap i { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#666; font-size:13px; pointer-events:none; }
.pz-price-row { display:flex; gap:6px; align-items:center; }
.pz-price-row .pz-input-wrap { flex:1; }
.pz-price-sep { color:#555; font-weight:700; font-size:14px; flex-shrink:0; }
.pz-checkbox { display:flex; align-items:center; gap:8px; color:#aaa; font-size:12px; cursor:pointer; margin-top:8px; }
.pz-checkbox input[type="checkbox"] { accent-color:#545873; width:16px; height:16px; }
.pz-btn-filter { width:100%; background:#545873; border:none; border-radius:10px; color:#fff; font-weight:700; font-size:14px; padding:11px; cursor:pointer; transition:all .2s; margin-top:6px; }
.pz-btn-filter:hover { background:#36394d; transform:scale(1.02); }
.pz-btn-clear { width:100%; background:transparent; border:1px solid rgba(255,255,255,0.15); border-radius:10px; color:#aaa; font-weight:600; font-size:13px; padding:10px; cursor:pointer; transition:all .2s; margin-top:8px; }
.pz-btn-clear:hover { border-color:#ef4444; color:#ef4444; }

/* Category list */
.pz-cat-list { max-height:200px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#545873 transparent; }
.pz-cat-item { display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:8px; cursor:pointer; transition:all .15s; border-left:3px solid transparent; color:#ccc; font-size:13px; }
.pz-cat-item:hover,.pz-cat-item.active { background:rgba(124,58,237,0.1); border-left-color:#545873; color:#fff; }
.pz-cat-item img { width:28px; height:28px; border-radius:6px; object-fit:cover; }
.pz-cat-count { margin-left:auto; font-size:11px; color:#666; font-weight:600; }

/* â”€â”€ TOP BAR â”€â”€ */
.pz-topbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; flex-wrap:wrap; gap:12px; }
.pz-topbar-left { display:flex; flex-direction:column; justify-content:center; }
.pz-topbar-count { font-size:15px; color:#aaa; font-weight:600; }
.pz-topbar-right { display:flex; align-items:center; gap:10px; }
.pz-sort-select { background:#1e1e30; border:1px solid rgba(255,255,255,0.08); border-radius:10px; color:#fff; padding:9px 14px; font-size:13px; outline:none; cursor:pointer; appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23888' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; padding-right:32px; }
.pz-cta-btn { background:linear-gradient(135deg,#f97316,#ea580c); border:none; border-radius:50px; color:#fff; font-weight:700; font-size:13px; padding:10px 20px; cursor:pointer; transition:all .2s; white-space:nowrap; display:flex; align-items:center; gap:6px; }
.pz-cta-btn:hover { filter:brightness(1.1); transform:scale(1.03); }

/* â”€â”€ MAIN â”€â”€ */
.pz-main { flex:1; min-width:0; }

/* â”€â”€ GRID â”€â”€ */
.pz-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; align-items:stretch; }

/* â”€â”€ CARD â”€â”€ */
.pz-card { background:#1a1a2a!important; border:1px solid rgba(255,255,255,0.06)!important; border-radius:12px!important; overflow:hidden; display:flex; flex-direction:column; width:100%!important; height:auto!important; margin:0!important; padding:0!important; transition:transform .2s,border-color .2s,box-shadow .2s; position:relative; opacity:0; animation:pzFadeUp .35s ease forwards; border-left-width:1px!important; }
.pz-card:hover { transform:translateY(-3px); border-color:#545873!important; box-shadow:0 8px 24px rgba(124,58,237,0.15)!important; }
@keyframes pzFadeUp { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }

/* Badge - removed (no longer used) */

/* Card image */
.pz-card-img-wrap { position:relative; height:160px; overflow:hidden; }
.pz-card-img { width:100%!important; height:100%!important; object-fit:cover!important; transition:transform .3s; position:relative!important; left:0!important; top:0!important; }
.pz-card:hover .pz-card-img { transform:scale(1.05); }

/* Card body */
.pz-card-body { padding:12px!important; display:flex; flex-direction:column; flex:1; width:100%!important; height:auto!important; border:none!important; margin:0!important; box-sizing:border-box!important; }

/* Seller row */
.pz-seller-row { display:flex; align-items:center; gap:8px; margin:0 0 10px 0!important; padding:0 0 10px 0!important; border-bottom:1px solid rgba(255,255,255,0.06); width:100%!important; height:auto!important; border-right:none!important; border-top:none!important; box-sizing:border-box!important; }
.pz-seller-avatar { width:28px!important; height:28px!important; border-radius:50%; object-fit:cover; flex-shrink:0; }
.pz-seller-initials { width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#545873,#4f46e5); color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; flex-shrink:0; }
.pz-seller-info { display:flex; flex-direction:column; line-height:1.2; overflow:hidden; }
.pz-seller-label { font-size:9px; color:#666; text-transform:uppercase; letter-spacing:1px; font-weight:600; }
.pz-seller-name { font-size:12px!important; color:#fff!important; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; position:relative!important; top:0!important; margin:0!important; padding:0!important; }

/* Game tag */
.pz-game-tag { font-size:10px; color:#888; text-transform:uppercase; letter-spacing:0.5px; margin:0 0 4px 0!important; padding:0!important; font-weight:600; }

/* Title */
.pz-card-title { color:#fff!important; font-size:13px!important; font-weight:normal!important; line-height:1.35!important; height:35px!important; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin:0 0 8px 0!important; padding:0!important; text-decoration:none; position:relative!important; left:0!important; top:0!important; width:100%!important; }
.pz-card-title:hover { color:#757a9e!important; }

/* Price */
.pz-card-price { font-size:16px!important; font-weight:bold!important; color:#f59e0b!important; -webkit-text-fill-color:#f59e0b!important; margin:auto 0 0 0!important; padding:0!important; position:relative!important; width:100%!important; line-height:normal!important; background:none!important; }
.pz-card-price .pz-tl { font-size:12px; opacity:.7; margin-left:2px; }

/* No results */
.pz-no-results { grid-column:1/-1; text-align:center; padding:50px; color:#757a9e; font-size:18px; font-weight:700; background:#161622; border-radius:16px; border:1px dashed rgba(124,58,237,0.2); }

/* Mobile toggle */
.pz-mobile-toggle { display:none; background:#1e1e30; border:1px solid rgba(255,255,255,0.1); color:#fff; padding:10px 16px; border-radius:10px; font-weight:700; font-size:14px; cursor:pointer; margin-bottom:14px; align-items:center; gap:6px; }
.pz-filter-badge { background:#545873; color:#fff; font-size:10px; padding:2px 7px; border-radius:50px; margin-left:4px; }

/* Mobile overlay bg */
.pz-sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:99; }
.pz-sidebar-overlay.active { display:block; }

/* â”€â”€ Existing class overrides for card â”€â”€ */
.pz-card .AdvertData-User a { flex-direction:row!important; gap:8px!important; }
.pz-card .AdvertData-User { padding:0!important; border:none!important; }
.pz-card .AdvertMd-Image { border:none!important; background:none!important; }

/* â”€â”€ RESPONSIVE â”€â”€ */
@media(max-width:1399px){ .pz-grid{grid-template-columns:repeat(4,1fr);} }
@media(max-width:1199px){ .pz-grid{grid-template-columns:repeat(3,1fr);} }
@media(max-width:899px){ .pz-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:768px){
  .pz-page{flex-direction:column;}
  .pz-sidebar{position:fixed;left:-300px;top:0;bottom:0;width:280px;margin:0;border-radius:0;z-index:100;transition:left .3s ease;overflow-y:auto;}
  .pz-sidebar.open{left:0;}
  .pz-mobile-toggle{display:flex;}
  .pz-topbar{flex-direction:column;align-items:flex-start;}
  .pz-topbar-right{width:100%;justify-content:space-between;}
}
@media(max-width:599px){
  .pz-grid{grid-template-columns:repeat(2,1fr);gap:8px;}
  .pz-card-img-wrap{height:120px;}
  .pz-card-title{font-size:11px!important;height:30px!important;}
  .pz-card-price{font-size:14px!important;}
  .pz-seller-avatar,.pz-seller-initials{width:22px!important;height:22px!important;font-size:10px;}
  .pz-card-body{padding:8px;}

  .pz-cta-btn{font-size:11px;padding:8px 14px;}
}

