#btnFeedback {
    position:fixed;
    right:20px;
    bottom:70px;
    z-index:9999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #08245c;
    color: #fff;
    padding: 12px 18px;
    border-radius: 18px;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .2);
    transition: all .2s ease;
    width: max-content;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
}

@media (max-width:768px){

    #btnFeedback{
        right:15px;
        min-width: unset;
        width: 52px;
        height: 52px;

        padding: 0;
        border-radius: 50%;

        justify-content: center;
    }

    /* sembunyikan text */
    .cw-toggle-text{
        display: none;
    }

    /* sembunyikan icon close */
    #cwToggle .fa-xmark{
        display: none !important;
    }

    /* tampilkan hanya icon chat */
    #cwToggle .fa-comment-lines{
        display: block !important;
        font-size: 20px;
    }

    /* rapikan wrapper icon */
    .cw-toggle-icons{
        gap: 0;
    }
}

#btnFeedback:hover {
    transform: translateY(-2px);
}

.feedback-rating{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:8px;

}

.feedback-rating{
    display:flex;
    justify-content:center;
    gap:10px;
}

.feedback-rating i{

    font-size:35px;

    color:#d8dee8;

    cursor:pointer;

    transition:
        color .18s ease,
        transform .18s cubic-bezier(.2,.8,.2,1),
        filter .18s ease;

    transform-origin:center;
}


/* hover */

.feedback-rating i.hover,
.feedback-rating i.active{

    color:#ffc107;

}


/* zoom */

.feedback-rating i.hover{

    transform:translateY(-6px) scale(1.18);

    filter:drop-shadow(0 6px 10px rgba(255,193,7,.45));

}


/* bintang yg sedang diarahkan */

.feedback-rating i.current{

    transform:translateY(-10px) scale(1.35) rotate(-8deg);

}


/* efek klik */

.feedback-rating i.pop{

    animation:starPop .35s;
}


@keyframes starPop{

    0%{

        transform:scale(.7);

    }

    45%{

        transform:scale(1.45);

    }

    70%{

        transform:scale(1.15);

    }

    100%{

        transform:scale(1);

    }

}


/* Efek klik */

.feedback-rating i:active{

    transform:scale(.9);

}

#feedbackMessage{

    transition:
        border-color .2s ease,
        box-shadow .2s ease;

}

#feedbackMessage:focus{

    border-color:#0d6efd;

    box-shadow:
        0 0 0 .25rem rgba(13,110,253,.15);

}

.feedback-counter-animate{

    animation:feedbackCounter .18s;

}

@keyframes feedbackCounter{

    0%{

        transform:scale(.8);

    }

    60%{

        transform:scale(1.2);

    }

    100%{

        transform:scale(1);

    }

}