html, body { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 1.428; }
body { background: whitesmoke; 
       /*-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;*/ 
}
.navbar { padding-top: 0; padding-bottom: 0; background-color: #1b6d85;
  border-radius: 0; border: none; border-bottom: 4px solid #ddd; }
.navbar-brand { line-height: 50px; padding: 0; margin-left: 16px; margin-right: 12px; color: black; font-size: 18px }
.navbar-brand:hover { color: black }
.nav-link { line-height: 50px; padding: 0; width: 100%; text-align: center; font-size: 14px } /*padding=tinggi menu*/
.navbar-nav > li > a { margin: 0 8px; color: #E6E9ED; } /*lebar & warna menu utama*/
.navbar-nav > li > a:hover { color: orange; }
.navbar-nav > li > a:focus { background-color: #ddd; color: #000; }
.largemenu { position: static !important; }
.megamenu { width: 100%; padding: 14px 36px 18px; border-radius: 0; border: none;
  margin-top: 4px !important; border-bottom: 2px solid maroon; background: white; }
.megamenu ul { padding: 0 20px 0 0; margin: 0; }
.megamenu .dropdown-header { padding: 3px 12px; color: #117a8b; font-size: 14px; font-weight: bold } /*12px*/
.megamenu ul > li { list-style: none; font-size: 14px }
.megamenu ul > li > a { text-decoration: none; color: #000; 
  display: block; padding: 3px 12px; background: transparent !important; } /*12px*/
.megamenu ul > li > a:hover { text-decoration: none;
  color: #fff !important; background: #117a8b !important; }
.megamenu ul > hr { margin: 8px 12px; } 
.panel1 { position: fixed; left: 0; top: 54px; bottom: 0; width: 50px; padding-top: 10px;
  background: #1b6d85; line-height: 38px; font-size: 18px; text-align: center; }
.panel1 a, .panel1 button { padding: 6px; color: #fff; 
  line-height: 16px; background: none; border: none; outline: 0 } /*utk button*/
.panel2 { position: fixed; top: 54px; left: 50px; right: 0; line-height: 44px; 
  padding: 0 17px; box-shadow: 0 4px 2px -2px gray; z-index: 999; background: whitesmoke }
.panel2 a, .panel2 button { display: inline-block; padding: 0; margin-right: 12px; 
  line-height: 24px; color: #1b6d85; background: none; border: none; outline: 0; 
  text-decoration: none }
.toolbtn { padding: 0; color: #1b6d85; background: none; border: none; outline: 0; margin: 6px 12px 0 0 }
.btn-outline-secondary { border-color: #ced4da }
.panel1 a:hover, .panel1 button:hover, .panel2 button:hover,
.panel2 a:hover, .toolbtn:hover { color: orange; text-decoration: none; cursor: pointer; }
.panel3 { position: absolute; top: 98px; right: 0; bottom: 0; left: 50px;
  padding: 20px 17px 0; overflow-y: auto }
table td, table th { padding-top: 0 !important; padding-bottom: 0 !important; }
table.table { width: 100% !important; line-height: 26px; border-top: hidden; } /*tinggi baris*/
/*.table tfoot > tr > th { border-bottom: hidden; }*/
table { cursor:default; -moz-user-select: none; } /*disable text select*/
.table-striped>tbody>tr:nth-child(odd) { background-color: white; }

.dataTable > thead > tr > th[class*="sort"]:before,
.dataTable > thead > tr > th[class*="sort"]:after { display: none }
.dataTable > thead > tr > th { border-top-color: #ced4da; border-bottom-color: #ced4da !important; 
  /*border-bottom-width: 2px !important;*/ }
.dataTable > tbody > tr > td { border-bottom-color: #ced4da !important; }
.dataTable tbody tr.selected { color: #fff; background-color: #117a8b; }
.dataTables_info { line-height: 6px; } /*jarak info dg tabel*/
.dataTables_paginate a { line-height: 16px!important; background: #ddd!important; 
  box-shadow: none!important; border-color: #ddd!important }

.col-form-label { padding-bottom: 0 }
.form-control, .input-group, .no-group { margin-bottom: 4px; }
.input-group .form-control { margin-bottom: 0 } /*override yg diatasnya*/
label > input { margin-bottom: 13px }

td input:not([type="checkbox"]), .thfoot { 
  background: none; border: none; outline: none; max-height: 20px !important; width: 100% }
td .select2-selection { background: none !important; border: none !important; }
td .select2-container { max-height: 28px !important; margin-top: -2px; margin-left: -8px; 
  width: calc(100% + 30px) !important; }
td .select2-selection__placeholder { color: transparent !important; }
td .select2-selection__clear { margin-top: 1px }

:focus, 
.select2-container--bootstrap-5.select2-container--focus .select2-selection, /* <- gak usah*/
.select2-container--bootstrap-5.select2-container--open .select2-selection { 
  box-shadow: none !important; 
}
.select2-container .select2-results > .select2-results__options { max-height: 204px; }
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected {
  color: #212529; background-color: #fff; /* kembalikan warna semula */
}
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected="true"] {
  color: #fff; background-color: #117a8b; /* warna highlite */
}
.select2-container--open { z-index: 99999; }

.judul { color: #1b6d85; text-transform: uppercase; margin: 4px 0 0; font-size: 16px }
.subjudul { font-size: 13px; color: #73879C; margin: 4px 0 0; } 
.garis { border-bottom: 1px solid #ced4da; margin: 8px 0; }
.footer { border-top: 1px solid #ced4da; padding: 10px 0 4px; color: #73879C; }
th input { font-weight: bold }
.tblfoot { margin-top: -6px; border-bottom: 1px solid #ced4da }

hr { border-bottom: solid 1px #000 !important; }
textarea { height: 67px }

@media (max-width: 768px) {
  .navbar-nav { border-top: 1px solid white; }
  .navbar-nav > li:first-child { margin-top: 6px; }
  .nav-link { line-height: 38px; text-align: left; margin-left: 0!important; padding-left: 16px!important; }
  .megamenu { padding: 10px 24px; margin-top: 0 !important; max-height: 300px; overflow-y: auto; }
  .megamenu ul { padding: 0; margin-bottom: 30px; }
  .megamenu ul:last-child { margin-bottom: 10px; }
  .panel1 { display: none; }
  .panel2 { left: 0; line-height: normal; padding: 12px 17px; }
  .panel3 { left: 0; top: 126px; }
  .dinamis tr { display: table; width:100%; }
  .dinamis td { display: table-row; }
}