body {
            color: #666666;
            width: 100%;
            background-color: #f9f8f6;
            background-image: url("images/allimages.jpg");
            background-repeat: no-repeat;
            background-size: cover;
            font-family: Georgia, Times, serif;
            line-height: 1.4em;
            margin: 0px;
        }
        /* Kontainer Utama */
        .wrapper {
            width: 90%; /* Sesuaikan jika perlu */
            margin: 20px auto;
            border: 2px solid #000000;
            background-color: #eeeeee;
            padding: 15px;
        }
        header {
            height: 150px;
            background-image: url('images/logo0.jpg');
            background-repeat: no-repeat;
            background-size: cover;
        }
        h1 {
            text-indent: -9999px;
            width: 100%;
            height: 130px;
            margin: 0px;
        }
        .navbar-default {
            background-color: #0d6efd; /* Biru terang */
            border: none;
        }
        .navbar-default .navbar-brand,
        .navbar-default .nav > li > a {
            color: #fff;
        }
        .navbar-default .navbar-toggle .icon-bar {
            background-color: #fff;
        }
        /* ==================================== */
        /* === PERUBAHAN UTAMA UNTUK LAYOUT === */
        /* ==================================== */
        .main-layout-container {
            display: flex; /* Menggunakan Flexbox untuk tata letak kolom */
            flex-wrap: nowrap; /* Mencegah wrap pada desktop */
            min-height: 800px; /* Minimal tinggi agar terlihat seperti diagram */
        }
        /* Kolom Menu Kiri (Kuning) */
        .column-menu {
            flex: 0 0 300px; /* Lebar tetap 300px untuk menu */
            /* Menggunakan warna kuning solid untuk background wrapper */
            background-color: #FFFF00; /* Kuning */
            padding: 15px;
            border: 3px solid #000000;
            margin-right: 15px;
            position: relative;
        }
        .column-menu .content-box {
             /* Hapus border content-box di sini jika sudah ada di menu wrapper */
             border: none; 
             background-color: transparent;
             padding: 0;
        }

        /* Kolom Konten Kanan */
        .column-content {
            flex-grow: 1; /* Mengisi sisa ruang */
            display: flex;
            flex-direction: column; /* Mengatur konten di dalam kolom kanan secara vertikal */
            border: 3px solid #000000; /* Border konten utama */
            background-color: #eeeeee; /* Latar belakang untuk konten */
        }
        
        /* Bagian Top Kanan (Biru Muda) */
        .section-top {
            flex: 0 0 200px; /* Tinggi tetap 200px untuk bagian top */
            background-color: #B0C4DE; /* LightSteelBlue/Biru Muda untuk Top */
            padding: 15px;
            border-bottom: 3px solid #000000;
            position: relative;
        }
        
        /* Bagian Konten Utama Kanan Bawah (Abu-abu/Putih) */
        .section-main {
            flex-grow: 1; /* Mengisi sisa ruang vertikal */
            padding: 15px;
            background-color: #fff; /* Warna kontras untuk konten utama */
        }

        /* Responsive untuk perangkat kecil */
        @media (max-width: 991px) {
            .main-layout-container {
                flex-direction: column;
            }
            .column-menu {
                flex: none;
                width: 100%;
                margin-right: 0;
                margin-bottom: 15px;
            }
            .section-top {
                flex: none;
                width: 100%;
                border-bottom: none; /* Hapus border saat mode kolom */
            }
            .column-content {
                border: none;
            }
            .section-top, .section-main {
                 border: 3px solid #000000;
                 margin-bottom: 15px;
            }
        }
        /* ==================================== */

        .list-group-item.active {
            background-color: #0d6efd;
            border-color: #0d6efd;
        }
        footer {
            clear: both;
            color: #ffffff;
            background-color: #0d6efd;
            height: 30px;
            padding: 7px 0px 0px 20px;
            text-align: center;
        }
        #tombolScrollTop {
            cursor: pointer;
            position: fixed;
            right: 20px;
            bottom: 20px;
            border: 3px solid #585858;
            background-color: white;
            color: #585858;
            border-radius: 100%;
            height: 50px;
            width: 50px;
            font-size: 24px;
            display: none;
            line-height: 45px;
            text-align: center;
            z-index: 1000;
        }
        /* Custom styles for the prayer schedule buttons */
        .btn-prayer {
            text-align: left;
            font-weight: bold;
            padding: 10px 15px;
            margin-bottom: 5px;
            border-radius: 8px;
            width: 100%; /* Agar penuh */
        }
        .btn-prayer i {
            margin-right: 10px;
        }
        /* Style untuk tombol-tombol di sidebar (mengikuti screenshot) */
        .btn-sidebar-green {
            background-color: #4CAF50; /* Green */
            color: white;
            margin-bottom: 5px;
        }
        .btn-sidebar-red {
            background-color: #F44336; /* Red */
            color: white;
            margin-bottom: 5px;
        }
        .btn-sidebar-warning {
             background-color: #ff9800; /* Orange/Warning */
            color: white;
            margin-bottom: 5px;
        }