.elementor-30 .elementor-element.elementor-element-2d9c771d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-30 .elementor-element.elementor-element-a9eebac{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 30px) 0px;text-align:center;}.elementor-30 .elementor-element.elementor-element-a9eebac .elementor-heading-title{font-family:"Host Grotesk", Sans-serif;font-size:35px;font-weight:600;color:var( --e-global-color-5590d97 );}:root{--page-title-display:none;}@media(max-width:767px){.elementor-30 .elementor-element.elementor-element-5b1c0583{padding:8px 8px 8px 8px;}}/* Start custom CSS for html, class: .elementor-element-5b1c0583 *//* Wrapper untuk scroll horizontal */
.crypto-table-wrapper {
  width: 100%;
  overflow-x: auto;
  margin: 20px 0;
  -webkit-overflow-scrolling: touch;
  position: relative;
}

/* Styling Table */
.crypto-table {
  width: 100%;
  border-collapse: collapse;
  background: white;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  font-size: 14px;
  min-width: 1000px; /* Minimal lebar agar bisa scroll */
}

.crypto-table thead {
  background: #f8f9fa;
  border-bottom: 2px solid #dee2e6;
}

.crypto-table th {
  padding: 15px 12px;
  text-align: left;
  font-weight: 600;
  color: #495057;
  font-size: 13px;
  white-space: nowrap;
}

.crypto-table td {
  padding: 15px 12px;
  border-bottom: 1px solid #e9ecef;
  color: #212529;
  white-space: nowrap;
}

.crypto-table tbody tr:hover {
  background-color: #f8f9fa;
  transition: background-color 0.2s;
}

.crypto-table tbody tr:last-child td {
  border-bottom: none;
}

/* Asset Name Styling */
.asset-name {
  font-size: 12px;
  color: #6c757d;
  display: block;
  margin-top: 2px;
}

/* Change Positive/Negative */
.change-positive {
  color: #28a745;
  font-weight: 600;
}

.change-negative {
  color: #dc3545;
  font-weight: 600;
}

/* ===== STICKY COLUMNS (Desktop & Mobile) ===== */
.sticky-col {
  position: sticky;
  background: white;
  z-index: 2;
}

/* Kolom pertama: Asset ID */
.sticky-col-1 {
  left: 0;
  min-width: 100px;
}

/* Kolom kedua: Asset */
.sticky-col-2 {
  left: 100px; /* Sesuaikan dengan lebar kolom pertama */
  min-width: 120px;
}

/* Shadow effect saat scroll */
.sticky-col::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 10px;
  pointer-events: none;
}

/* Header sticky columns dengan background berbeda */
.crypto-table thead .sticky-col {
  background: #f8f9fa;
  z-index: 3;
}

/* Hover effect tetap terlihat di sticky columns */
.crypto-table tbody tr:hover .sticky-col {
  background-color: #f8f9fa;
}

/* ===== RESPONSIVE MOBILE ===== */
@media screen and (max-width: 768px) {
  
  .crypto-table {
    font-size: 12px;
    min-width: 800px; /* Kurangi min-width untuk mobile */
  }
  
  .crypto-table th,
  .crypto-table td {
    padding: 10px 8px;
  }
  
  /* Kurangi lebar sticky columns di mobile */
  .sticky-col-1 {
    min-width: 80px;
    left: 0;
  }
  
  .sticky-col-2 {
    min-width: 100px;
    left: 80px; /* Sesuaikan dengan lebar kolom pertama */
  }
  
  /* Asset name lebih kecil di mobile */
  .asset-name {
    font-size: 10px;
  }
}

/* Extra small devices */
@media screen and (max-width: 480px) {
  
  .crypto-table {
    font-size: 11px;
    min-width: 700px;
  }
  
  .crypto-table th,
  .crypto-table td {
    padding: 8px 6px;
  }
  
  .sticky-col-1 {
    min-width: 70px;
    font-size: 10px;
  }
  
  .sticky-col-2 {
    min-width: 90px;
    left: 70px;
  }
  
  .sticky-col-2 strong {
    font-size: 12px;
  }
  
  .asset-name {
    font-size: 9px;
  }
}

/* Scrollbar styling (opsional, untuk estetika) */
.crypto-table-wrapper::-webkit-scrollbar {
  height: 8px;
}

.crypto-table-wrapper::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 10px;
}

.crypto-table-wrapper::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 10px;
}

.crypto-table-wrapper::-webkit-scrollbar-thumb:hover {
  background: #555;
}/* End custom CSS */