/* =====================================================
   🧱 DASHBOARD LAYOUT 
===================================================== */

.dashboard-layout {
  display: grid;
  grid-template-columns: 140px 1fr 270px;

  gap: 15px;
  padding: 20px;

  min-height: calc(100vh - 180px); 
  overflow: visible; 
}

.tabs + #hellevator-dashboard {
  margin-top: 0;
}

#hellevator-content-wrapper {
  flex: 1;
}


/* =====================================================
   📜 CENTER SCROLL AREA 
===================================================== */

.center-scroll {
  overflow-y: auto;
  padding-right: 10px;

  max-height: calc(100vh - 220px); 
}

/* =====================================================
   📦 SIDE COLUMN
===================================================== */

.side-column {
  width: 100%;
}


/* =====================================================
   🧩 PLAYER CARDS GRID
===================================================== */

.cards-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 15px;
}


/* =====================================================
   🎯 TAB SYSTEM 
===================================================== */

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}


/* =====================================================
   🧼 SCROLLBAR 
===================================================== */

.center-scroll::-webkit-scrollbar {
  width: 8px;
}

.center-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.center-scroll::-webkit-scrollbar-thumb {
  background: #6b4a1c;
  border-radius: 4px;
}

.center-scroll::-webkit-scrollbar-thumb:hover {
  background: #8a6128;
}

html, body {
  height: 100%;
  overflow: hidden; 
}

/* ----------------------------------------------------
   TAB SYSTEM FIX
---------------------------------------------------- */

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}