/* 1. Menyeragamkan Ukuran Gambar */
.gallery-img {
    /* width: 60%;          Lebar gambar di desktop */
	width: auto;
    height: 400px;       /* Tentukan tinggi yang Anda inginkan */
       /* Memastikan gambar terpotong rapi, bukan gepeng */
    
}

/* Responsif untuk Mobile */
@media (max-width: 768px) {
    .gallery-img {
        width: 100%;
        height: 250px;
    }
}

/* 2. Style Panah (Arrow) Menarik */
.carousel-control-prev,
.carousel-control-next {
    width: 5%; /* Mengecilkan area klik agar tidak menutupi gambar */
}

.custom-arrow {
    background-color: rgba(198, 22, 22, 0.5); /* Background hitam transparan */
    border-radius: 50%;                  /* Membuat bentuk lingkaran */
    padding: 20px;                       /* Ukuran lingkaran */
    background-size: 50% 50%;            /* Ukuran icon di dalam */
    transition: all 0.3s ease;
}

.custom-arrow:hover {
    background-color: rgba(0, 0, 0, 0.8); /* Warna lebih gelap saat hover */
    transform: scale(1.1);               /* Efek sedikit membesar */
}

/* Jika ingin mengubah warna icon di dalam menjadi putih/hitam tetap gunakan filter */
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: invert(1); /* Invert 1 membuat panah jadi putih jika bg hitam */
}