:root {
  --hrp-bar-height: 52px;
  --hrp-bg: rgba(17, 24, 39, 0.85);
  --hrp-bg-hover: rgba(255, 255, 255, 0.06);
  --hrp-border: rgba(255, 255, 255, 0.06);
  --hrp-border-active: rgba(255, 255, 255, 0.12);
  --hrp-text: rgba(255, 255, 255, 0.9);
}

/* Top Toolbar */
#hrp-bar{position:fixed;top:0;left:0;right:0;height:var(--hrp-bar-height);z-index:1000;backdrop-filter:saturate(150%) blur(8px);background:linear-gradient( to right, rgba(17,24,39,0.85), rgba(17,24,39,0.6)); border-bottom:1px solid rgba(255,255,255,0.06);}
#hrp-bar .hrp-bar-inner{max-width:1200px;margin:0 auto;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 16px;}
#hrp-bar .hrp-brand{font-weight:700;letter-spacing:.5px;color:#fff}
#hrp-bar .hrp-nav{display:flex;gap:14px}
#hrp-bar .hrp-nav a{color:var(--hrp-text);text-decoration:none;font-size:14px;padding:6px 10px;border-radius:8px;border:1px solid transparent}
#hrp-bar .hrp-nav a:hover{background:rgba(255,255,255,0.06);}
#hrp-bar .hrp-nav a.active{border-color:rgba(255,255,255,0.12)}

/* Adjust body to account for fixed toolbar */
body{scroll-margin-top:var(--hrp-bar-height)}

/* Improve dashboard cards with glass effect */
.dashboard-card, [class*="card"]{
  background:rgba(17, 24, 39, 0.4) !important;
  backdrop-filter:blur(12px) saturate(120%);
  border:1px solid rgba(255,255,255,0.08) !important;
  border-radius:12px !important;
  transition:all 0.2s ease;
}

.dashboard-card:hover, [class*="card"]:hover{
  background:rgba(17, 24, 39, 0.5) !important;
  border-color:rgba(255,255,255,0.12) !important;
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,0.15);
}

/* Improve spacing and layout */
.container{padding-top:1rem;}
main{padding-top:calc(var(--hrp-bar-height) + 1rem);}

/* Marketplace vehicles modal: prevent close (X) overlapping price */
.fixed.inset-0.z-50 div[class*="bg-background/20"][class*="border-b"]{
  padding-top:4.25rem !important;
}

.fixed.inset-0.z-50 button[class*="top-5"][class*="right-5"][class*="rounded-full"][class*="p-3"]{
  top:1rem !important;
  right:1rem !important;
  padding:0.5rem !important;
}

/* Polish buttons */
button, [role="button"]{
  transition:all 0.2s ease;
}

button:hover, [role="button"]:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
}
