.dataTables_length{
    display:none;
}

.dataTables_filter{
    float:none !important;
    margin:0;
}

.dataTables_filter label{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0;
}

.dataTables_filter input{
    width:250px !important;
}

.dataTables_wrapper .row:first-child{
    display:none;
}

#tableSearch{
    width:100%;
}

#tableSearch .dataTables_filter{
    float:none;
    margin:0;
}

#tableSearch .dataTables_filter label{
    width:100%;
    margin:0;
}

#tableSearch .dataTables_filter input{
    width:100% !important;
    margin-left:0 !important;
}

/* ===== Modern Toast ===== */
.swal2-container.swal2-top-end{
    padding:15px !important;
}

.swal2-popup.swal2-toast{
    width:330px !important;
    padding:14px 16px !important;
    border-radius:10px !important;
    background:#fff !important;
    box-shadow:0 10px 25px rgba(0,0,0,.12) !important;
    border-left:4px solid #64748b;
}

/* Hilangkan icon bawaan */
.swal2-toast .swal2-icon{
    display:none !important;
}

.swal2-toast .swal2-title{
    margin:0 !important;
    padding:0 !important;
    font-size:14px !important;
    font-weight:400 !important;
    color:#1e293b;
}

.swal2-toast .swal2-html-container{
    margin:5px 0 0 !important;
    padding:0 !important;
    font-size:13px !important;
    line-height:1.5;
    color:#64748b;
}

.swal2-toast .swal2-close{
    width:20px !important;
    height:20px !important;
    font-size:15px !important;
    color:#94a3b8 !important;
    transition:.2s;
}

.swal2-toast .swal2-close:hover{
    color:#334155 !important;
}

.swal2-timer-progress-bar{
    height:3px !important;
    opacity:.25;
}

/* Warna berdasarkan jenis */
.swal2-toast.swal2-icon-success{
    border-left-color:#8fbd56;
}

.swal2-toast.swal2-icon-error{
    border-left-color:#d12c47 !important;
}

.swal2-toast.swal2-icon-warning{
    border-left-color:#e7c354 ;
}

.swal2-toast.swal2-icon-info{
    border-left-color:#59adec ;
}

/* SweetAlert Dialog */
.swal-sm{
    width:360px !important;
    padding:1.25rem !important;
    border-radius:10px !important;
}

.swal-title-sm{
    font-size:14px !important;
    font-weight:600;
}

.swal-text-sm{
    font-size:12px !important;
    color:#64748b;
}

.swal-btn-sm{
    padding:.45rem 1rem !important;
    font-size:12px !important;
}

/* Restore Dialog */
.restore-popup{
    width:400px !important;
    padding:24px !important;
    border-radius:12px !important;
}

.restore-title{
    font: size 20px !important;
    font-weight:600 !important;
    margin-bottom:20px !important;
}

.restore-info{
    text-align: center;
    font-size: 14px !important;
    font-weight: normal !important;
}

.restore-item{
    margin-bottom:16px;
}

.restore-item span{
    display:block;
    font-size:12px;
    color:#94a3b8;
    margin-bottom:4px;
}

.restore-item strong{
    font-size:15px;
    color:#334155;
    font-weight:600;
}

.restore-alert{
    background:#fff8e8;
    border:1px solid #ffe7ad;
    border-radius:8px;
    padding:12px 14px;
    font-size:14px;
    color:#7c5b00;
    line-height:1.6;
    margin-top:8px;
}

.restore-confirm,
.restore-cancel{
    min-width:110px;
}

.restore-confirm{
    background:#8fbd56 !important;
}

.restore-cancel{
    background:#6c757d !important;
}

/* letter */
.file-preview-desktop {
    display: block;
}

.file-preview-mobile {
    display: none;
}

/* icon */
.fa-white {
    color: white !important;
}

/* Styling Permission Item */
.permission-item {
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 20px;
    transition: all 0.2s;
}
    
.permission-item:hover {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.search-permission:focus {
    border-color: #ced4da !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Radiobutton */
input[type="radio"] {
    cursor: pointer !important;
}

/* FIX from template */
.dark-mode .form-control:disabled, .dark-mode .form-control[readonly]
{
    background-color: var(--dark-bg) !important;
}

.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback)
{
    border-top-right-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
}

.table-hover>tbody>tr:hover>* {
    --bs-table-accent-bg: var(var(--bs-table-hover-bg));
    color: rgb(107, 107, 107) !important;
}

.table-light {
    background-color: rgba(0, 0, 0, 0.050) !important;
}

/* Logo */
.mod-brand-img {
    height: 3rem !important;
}

@media (max-width: 576px) {
    .status-penduduk {
        display: none !important;
    }

    .nama-penduduk h4, .h4 {
        font-size: 20px !important;
    }
}

@media (max-width: 768px) {
    .file-preview-desktop {
        display: none !important;
    }
    
    .file-preview-mobile {
        display: block !important;
    }
}

@media (min-width: 769px) {
    .file-preview-mobile {
        display: none !important;
    }
}