/* ===== General Styles ===== */
a {
  text-decoration: none;
}

html, body {
  scrollbar-gutter: stable;
  overflow-y: scroll;
}

/* ===== Table Styles ===== */
.table-wrapper {
  max-height: 700px;
  overflow-y: auto;
  position: relative;
}

.table thead {
  position: sticky;
  top: 0;
  z-index: 3000;
  background: white;
  display: table-header-group;
}

.table thead th {
  border-bottom: 2px solid #ddd;
  text-align: center;
  padding: 10px;
}

/* ===== HEADER TABEL ===== */
.table-wrapper .table-primary > thead > tr > th {
  background-color: #d1e7ff !important; /* Warna biru muda sama seperti Bootstrap */
  border-color: #dee2e6 !important;
}

/* Sticky Header - Pastikan warna tetap */
.table-wrapper .table thead {
  background: #d1e7ff !important; /* Warna header */
}

/* Kolom No */
.table-wrapper .table thead tr th:first-child {
  background: #d1e7ff !important;
  z-index: 1500;
}

/* Kolom Nama Lokasi */
.table-wrapper .table thead tr th:nth-child(2) {
  background: #d1e7ff !important;
  z-index: 2400;
  text-align: left !important;
  padding-left: 8px !important;
}


/* Sticky first column (No) */
.table tbody tr td:first-child,
.table thead tr th:first-child {
  position: sticky;
  left: 0;
  z-index: 1500;
  background: white;
}

/* Sticky second column (Pos Duga Air) */
.table tbody tr td:nth-child(2),
.table thead tr th:nth-child(2) {
  position: sticky;
  left: 35px;
  z-index: 2400;
  background: white;
}

/* ===== Map Styles ===== */
#map {
  width: 100%;
  height: 400px;
}

/* ===== Modal Styles ===== */
.modal.show .modal-dialog {
  margin-top: 5vh;
}

.modal-backdrop {
  z-index: 3040 !important;
}

.modal {
  z-index: 3050 !important;
}

.modal-content {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
}

.modal-title {
  font-size: 18px;
  font-weight: 500;
}

.modal-body {
  font-size: 14px;
}

.modal table {
  font-size: 13px;
}

body {
  overflow: visible !important;
}

body.modal-open {
  padding-right: 0 !important;
}

/* ===== Search Highlight Styles ===== */
.highlight {
  background-color: yellow;
  padding: 1px 2px;
  border-radius: 2px;
}

.highlight.current {
  background-color: orange;
  font-weight: bold;
}