.homekontrol{
    color: white;
    background-color: rgba(135, 222, 161, 0.541);
}
.kolom1.dtfc-fixed-start.dtfc-fixed-left{
    overflow-wrap: break-word !important;
}
.kolom1{
    padding-left: 10px !important;
    text-align: left !important;
    padding: 3px !important; /* Adjust as needed */
    border: 0.1px solid rgba(255, 255, 255, 0.5) !important;
}
.kontrol, #_notch{
    opacity: 0;
    transition: opacity 1s ease; /* Define transition for opacity change */
}

.kontrol.fade-in, #_notch.fade-in{
    opacity: 1; /* Set opacity to 0 to trigger fade out */
}

/* #_tabel thead th {
    text-align: center !important;
} */

table {
    font-size: 0.8em;
    opacity: 0; /* Initially invisible */
    transition: opacity 1s ease-in-out; /* Smooth transition */
}

/* Define the fade-in animation */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Apply the fade-in animation when the table becomes visible */
table.fade-in {
    animation: fadeIn 1.5s ease-in-out forwards;
}

.labelbutton{
    color: #0A8270;
}
.btnutama{
    border-radius: 30px;
    color : white;
    background-color: #0A8270;

}
.btnutama:focus, .btnutama:hover, .btnutama:active{
    color:white;
    background-color: #24d642;         
}
.btnutama2{
    border-radius: 30px;
    color : #0A8270;
    background-color: white;

}
.btnutama2:focus{
    color:#24d642;
    background-color: white;         
}
.btnutama2:disabled {
    opacity: 0.5; /* Adjust opacity to visually indicate disabled state */
    cursor: not-allowed; /* Change cursor to indicate that the button is disabled */
    color:black;
    background-color:#a3f8eb;
    border: 0px
}

.wrappanel{
    border-radius: 20px;
    background-color: rgba(255, 255, 255, 0.548);
}
._judulhalTabel span{
    color: #0A8270;
    font-weight: 800;
    font-size: 1.5em;
    padding-left: 0px;
}
._judulhalTabel p{
    color: #797979;
    font-size: 0.8em;
    padding-left: 0px;
}

._catatanTabel span{
    color: #0a0a0a;
    font-weight: 600;
    font-size: 1.2em;
    padding-left: 0px;
}
._catatanTabel p{
    color: #797979;
    font-size: 1em;
    padding-left: 0px;
}

.layerbawah{
    height: 55px;
    font: white;
    background-image: linear-gradient(315deg, #0A8270 0%, #7CFF6B 100%);
    transition: height 0.9s ease, border-radius 0.9s ease;
}
.layerbawah.lipat{
    height: 80px;
    border-radius: 30px 30px 0 0;
    box-shadow: 0px -5px 10px rgba(0, 0, 0, 0.137);
}

.tombolstrip div{
    background-color: rgb(231, 231, 231);
    border-radius: 30px;
    width: 60px;
    height: 8px;
    margin-top: 10px;
    margin-bottom: 10px;
}









/* OVERRIDE DATATABLES */
.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 0px !important;
}
/* Adjust padding for the entire table */
#_tabel td {
    border: 1px solid black !important;
}
#_tabel tbody td {
    text-align: center;
    padding: 3px !important; /* Adjust as needed */
    padding-right: 7px !important;
    border: 0.1px solid rgba(255, 255, 255, 0.5) !important;
}
td{
    background-color: #dffadb;
}
th{
    color: white;
    background-color: #0A8270;
}
table {
    font-size: 0.8em;
}

#_tabel_wrapper .dataTables_length,
#_tabel_wrapper .dataTables_filter,
#_tabel_wrapper .dataTables_info,
#_tabel_wrapper .dataTables_processing {
    font-size: 0.8em; /* Adjust the font size as needed */
}
div#_tabel_wrapper.dt-container.dt-empty-footer{
    padding: 0px !important;
}

table.dataTable.nowrap th{
    text-align:center !important; 
    border: 0.1px solid rgba(255, 255, 255, 0.5); 
    padding: 5px;
}

.dt-buttons {
    display: none; /* Hide default export buttons */
}

th.dt-orderable-none dtfc-fixed-start dtfc-fixed-left{
    text-align:left !important; border: 0.1px solid rgba(255, 255, 255, 0.5) !important; padding: 5px !important;
}