.chapter-navigation {
                width: 100%;
                text-align: center;
                background: #f8f9fa;
                padding: 10px 0;
                border-radius: 10px;
                box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
                overflow: hidden;
                direction: rtl;
                /* Ensure RTL direction */
            }

            .chapter-navigation ul {
                list-style: none;
                padding: 0;
                margin: 0;
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                gap: 8px;
                /* Consistent gap between items */
            }

            .chapter-navigation li {
                display: inline-block;
                margin: 5px;
                padding: 8px 12px;
                /* Adjusted padding for better proportions */
                border-radius: 5px;
                background: var(--primary-color);
                color: white;
                font-weight: bold;
                transition: background 0.3s;
                flex: 0 0 auto;
                /* Prevent flex-grow and flex-shrink */
                text-align: center;
                /* Center text inside each item */
                min-width: 40px;
                /* Minimum width for buttons */
                max-width: 80px;
                /* Maximum width for buttons */
                white-space: nowrap;
                /* Prevent text from wrapping */
            }

            .chapter-navigation li a {
                text-decoration: none;
                color: white;
                /* Ensure the entire area is clickable */
            }

            .chapter-navigation li:hover {
                background: #0056b3;
            }

            /* Scrollbar styling for WebKit browsers (Chrome, Safari, Edge) */
            .chapter-navigation ul::-webkit-scrollbar {
                width: 8px;
                /* Width of the scrollbar */
                height: 8px;
                /* Height of the scrollbar (for horizontal scrollbars) */
            }

            .chapter-navigation ul::-webkit-scrollbar-track {
                background: #f1f1f1;
                /* Background color of the track */
                border-radius: 10px;
                /* Rounded corners for the track */
            }

            .chapter-navigation ul::-webkit-scrollbar-thumb {
                background: #888;
                /* Color of the scrollbar thumb */
                border-radius: 10px;
                /* Rounded corners for the thumb */
            }

            .chapter-navigation ul::-webkit-scrollbar-thumb:hover {
                background: #555;
                /* Color of the scrollbar thumb on hover */
            }

            /* Responsive Design for Small Screens */
            @media (max-width: 600px) {
                .chapter-navigation ul {
                    flex-wrap: nowrap;
                    /* Prevent wrapping on small screens */
                    overflow-x: auto;
                    /* Enable horizontal scrolling */
                    white-space: nowrap;
                    /* Prevent line breaks */
                    padding: 5px;
                    justify-content: flex-start;
                    /* Align items to the start for scrolling */
                }

                .chapter-navigation li {
                    padding: 6px 10px;
                    /* Slightly smaller padding for small screens */
                    min-width: 35px;
                    /* Smaller minimum width for small screens */
                    max-width: 60px;
                    /* Smaller maximum width for small screens */
                    font-size: 0.9em;
                    /* Slightly smaller font size for small screens */
                }
            }

            /* Responsive Design for Medium Screens */
            @media (min-width: 601px) and (max-width: 1024px) {
                .chapter-navigation ul {
                    gap: 8px;
                    /* Slightly smaller gap for medium screens */
                }

                .chapter-navigation li {
                    padding: 8px 12px;
                    /* Adjust padding for medium screens */
                    min-width: 40px;
                    /* Adjust minimum width for medium screens */
                    max-width: 70px;
                    /* Adjust maximum width for medium screens */
                    font-size: 0.95em;
                    /* Slightly smaller font size for medium screens */
                }
            }

            /* Responsive Design for Large Screens */
            @media (min-width: 1025px) {
                .chapter-navigation ul {
                    gap: 10px;
                    /* Larger gap for large screens */
                }

                .chapter-navigation li {
                    padding: 10px 15px;
                    /* Larger padding for large screens */
                    min-width: 50px;
                    /* Larger minimum width for large screens */
                    max-width: 80px;
                    /* Larger maximum width for large screens */
                    font-size: 1em;
                    /* Default font size for large screens */
                }
            }

            /* Bible Text Section */
            .GEN {
                font-family: 'Noto Nastaliq Urdu', serif;
                max-width: 1500px;
                margin: 0 auto;
                margin-bottom: 30px;
                margin-top: 40px;
                padding: 20px;
                background-color: #f8f9fa;
                border-radius: 10px;
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
                direction: rtl;
                /* Ensure RTL direction for the Bible text */
            }

            .GEN .cn {
                font-weight: bold;
                font-size: 1.4em;
                padding-bottom: 10px;
                color: var(--primary-color);
                text-align: right;
                /* Align chapter number to the right */
            }

            .GEN .bh {
                font-weight: bold;
                font-size: 1.6em;
                color: var(--primary-color);
                display: block;
                margin-bottom: 10px;
                text-align: center;
                /* Align section heading to the right */
            }

            .GEN .vn {
                font-weight: bold;
                color: var(--primary-color);
                margin-left: 5px;
                /* Adjust verse number spacing for RTL */
            }

            .GEN span {
                font-size: 1.13em;
                line-height: 2.5;
                color: var(--text-color);
                text-align: right;
                /* Ensure text alignment is right */
            }

            .GEN div {
                margin-bottom: 20px;
                /* Add spacing between verses */
            }

            /* Responsive Design */
            @media (max-width: 768px) {
                .GEN {
                    padding: 15px;
                }

                .GEN .cn {
                    font-size: 1.2em;
                }

                .GEN .bh {
                    font-size: 1.5em;
                }

                .GEN span {
                    font-size: 1em;
                }
            }

            @media (max-width: 576px) {
                .GEN {
                    padding: 10px;
                }

                .GEN .cn {
                    font-size: 1em;
                }

                .GEN .bh {
                    font-size: 1.5em;
                }

                .GEN span {
                    font-size: 1em;
                }
            }

            :target {
                scroll-margin-top: 80px;
                /* Adjust this based on your header height */
            }
           .scroll-to-top {
            position: fixed;
            bottom: 20px;
            left: 20px;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            justify-content: center;
            align-items: center;
            display: none;
        }
          .GEN .ChapterContent_r___3KRx {
        display: flex;
        font-size: 0.75em;
      }

      .GEN .ChapterContent_r___3KRx span {
        padding: 3px;
        color: brown;
      }

      .GEN .ChapterContent_r___3KRx a:hover {
        color: var(--primary-color);
      }