/* =========================================================
   CSS hasil ekstraksi dari blok <style> #19
   Nama file: 19-ft-btn.css
   ========================================================= */

body {
            padding-bottom: 70px;
        }

        /* Mencegah konten tertutup footer */

        .footertogelPECITOTO {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 65px;
            background: linear-gradient(180deg, #9c9c9c 0%, #000000 100%);
            display: flex;
            justify-content: space-around;
            align-items: center;
            z-index: 99999;
            border-top: 2px solid #fff;
            box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.7);
            animation: activeBorder 2s infinite alternate;
            overflow: visible;
        }

        /* Animasi Border Putih Aktif Bergani-ganti */
        @keyframes activeBorder {
            0% {
                border-color: #fff;
                box-shadow: 0 -2px 10px #fff;
            }

            50% {
                border-color: #ff0000;
                box-shadow: 0 -4px 20px #9932cc;
            }

            100% {
                border-color: #000;
                box-shadow: 0 -2px 15px #fff;
            }
        }

        .ft-btn {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            color: #fff;
            font-family: sans-serif;
            transition: 0.3s;
            position: relative;
        }

        .ft-btn svg {
            width: 22px;
            height: 22px;
            fill: #fff;
            margin-bottom: 3px;
            transition: 0.3s;
        }

        .ft-btn span {
            font-size: 10px;
            font-weight: 900;
            text-transform: uppercase;
        }

        /* Tombol Daftar di Tengah (Lebih Menonjol) */
        .ft-main {
            background: linear-gradient(145deg, #a8a8a8, #a8a8a8);
            height: 75px;
            margin-top: -30px;
            border-radius: 50% 50% 0 0;
            border-top: 3px solid #fff;
            box-shadow: 0 -5px 15px rgba(255, 255, 255, 0.4);
        }

        .ft-main svg {
            width: 28px;
            height: 28px;
        }

        /* Animasi Kilatan Otomatis di Background */
        .footertogelPECITOTO::before {
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 50%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
            transform: skewX(-30deg);
            animation: flashBg 4s infinite;
        }

        @keyframes flashBg {
            0% {
                left: -100%;
            }

            30% {
                left: 150%;
            }

            100% {
                left: 150%;
            }
        }

        /* Hover After Before Effect */
        .ft-btn:hover svg {
            transform: scale(1.2) translateY(-3px);
            fill: #ff0000;
        }

        .ft-btn::after {
            content: "";
            position: absolute;
            bottom: -5px;
            width: 0;
            height: 2px;
            background: #fff;
            transition: 0.3s;
        }

        .ft-btn:hover::after {
            width: 50%;
        }

        /* Presisi Mobile */
        @media (max-width: 360px) {
            .ft-btn span {
                font-size: 8px;
            }

            .ft-btn svg {
                width: 18px;
            }
        }
