/* Pastikan teks tidak terpotong */
table h1 {
    white-space: nowrap; /* Teks selalu dalam satu baris */
    overflow: hidden;    /* Hilangkan teks jika terlalu panjang */
    text-overflow: ellipsis; /* Tambahkan "..." jika teks terlalu panjang */
    font-size: 1.2rem; /* Ukuran teks yang lebih proporsional */
    font-weight: bold; /* Membuat teks lebih menonjol */
    color: #374774; /* Warna teks yang lebih profesional */
}

/* Tombol Foto */
.foto-button {
    font-size: 10px; /* Ukuran teks lebih kecil */
    padding: 4px 8px; /* Padding proporsional */
    background-color: rgba(34, 34, 34, 0.8); /* Warna gelap dengan transparansi */
    color: #fff; /* Teks berwarna putih */
    border: none; /* Tanpa border */
    border-radius: 5px; /* Sudut melengkung */
    cursor: pointer; /* Pointer berubah menjadi tangan saat diarahkan */
    transition: all 0.3s ease; /* Efek transisi */
}
.foto-button:hover {
    background-color: #0056b3; /* Warna biru cerah saat dihover */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* Efek bayangan */
}

/* Pengaturan Modal */
.modal-dialog {
    height: 90vh; /* Tinggi modal menjadi 80% dari viewport */
    max-height: 100vh; /* Maksimal tinggi modal */
    border-radius: 15px; /* Sudut melengkung modal */
    overflow: hidden; /* Mencegah konten melampaui batas */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Bayangan luar */
}

/* Konten Modal */
.modal-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: linear-gradient(to bottom, #ffffff, #f8f9fa); /* Gradasi latar belakang */
    border-radius: 15px;
    
}

/* Body Modal */
/* Gambar dalam Modal */
.modal-body {
    display: flex;
    justify-content: center; /* Center gambar secara horizontal */
    align-items: center; /* Center gambar secara vertikal */
    flex-wrap: wrap; /* Membolehkan gambar untuk dibungkus jika terlalu besar */
    padding: 15px;
    overflow-y: auto;
}

.modal-body img {
    max-width: 100%; /* Pastikan gambar tidak melampaui lebar modal */
    max-height: 70vh; /* Batasi tinggi gambar agar tidak terlalu besar */
    margin-bottom: 15px;
    border: 2px solid #dee2e6; /* Border tipis */
    border-radius: 10px;
    background-color: #f8f9fa;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.modal-body img:hover {
    transform: scale(1.05); /* Zoom saat hover */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); /* Bayangan saat hover */
}


