.wp-quick-poll-wrapper--modal {
    position: fixed;
    bottom: 10px;
    left: 10px;
    max-width: calc(100% - 20px);
    width: 100%;
    z-index: 20;
    transition: opacity 0.5s ease-in-out, bottom 0.5s ease-in-out;
    opacity: 0;
    visibility: hidden;
}

.wp-quick-poll-wrapper--modal.visible {
    visibility: visible;
    opacity: 1;
}

.wp-quick-poll {
    position: relative;
    margin: 30px 0;
    padding: 15px;
    border-radius: 10px;
    clear: both;
}

.wp-quick-poll-wrapper--modal .wp-quick-poll {
    margin: 0;
}

.wp-quick-poll.loading {
    opacity: 0.8;
}

.wp-quick-poll.loading:after {
    content: '';
    border-radius: 50%;
    width: 8em;
    height: 8em;
    font-size: 10px;
    position: absolute;
    border-top: 5px solid rgb(0 159 255);
    border-right: 5px solid rgb(0 159 255);
    border-bottom: 5px solid rgba(255, 255, 255, 0.2);
    border-left: 5px solid #ffffff;
    transform: translateZ(0);
    animation: load8 1.1s infinite linear;
    top: 50%;
    left: 50%;
    margin-left: -40px;
    margin-top: -40px;
    z-index: 9;
}

.wp-quick-poll--star {
    padding-top: 65px;
    background-color: #7B6FCF;
}

.wp-quick-poll--star:before {
    content: "";
    display: block;
    position: absolute;
    top: -10px;
    left: 15px;
    width: 231px;
    height: 67px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='231' height='67' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23B7AEF9' d='M6.463 65.517 25.9 55.72a4.463 4.463 0 0 1 4.014 0l19.442 9.798a4.46 4.46 0 0 0 5.897-1.8c.371-.663.566-1.41.566-2.17V5.133a5.13 5.13 0 0 0-1.506-3.63A5.145 5.145 0 0 0 50.68 0H5.141C3.778 0 2.47.54 1.506 1.504A5.13 5.13 0 0 0 0 5.134v56.413a4.443 4.443 0 0 0 2.12 3.788 4.46 4.46 0 0 0 4.343.183Z'/%3E%3Cpath fill='%23FFFCEE' d='M41.52 24.922a1.055 1.055 0 0 0-.587-1.8l-7.795-1.13a1.056 1.056 0 0 1-.795-.577l-3.487-7.055a1.055 1.055 0 0 0-1.505-.429 1.056 1.056 0 0 0-.39.43l-3.487 7.052a1.056 1.056 0 0 1-.796.578l-7.796 1.132a1.058 1.058 0 0 0-.876 1.296c.047.191.147.366.288.503l5.642 5.491a1.056 1.056 0 0 1 .303.935L18.91 39.1a1.053 1.053 0 0 0 .965 1.23c.197.015.393-.026.568-.118l6.977-3.66a1.058 1.058 0 0 1 .982 0l6.978 3.66a1.058 1.058 0 0 0 1.47-.536c.074-.182.096-.382.062-.576l-1.337-7.753a1.054 1.054 0 0 1 .303-.934l5.642-5.492Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .5h231v66H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat center;
}

.wp-quick-poll--circle {
    background: url("/wp-content/plugins/wp-quick-polls/assets/images/bg-circle.svg") no-repeat right -220px top -55px, linear-gradient(180deg, #3592F4 0%, #5273EC 100%), radial-gradient(341.03% 141.42% at 0% 0%, #B796FF 0%, rgba(212, 120, 255, 0.00) 100%);
    background-size: 455px 500px;
}

.wp-quick-poll--lines {
    background: url("/wp-content/plugins/wp-quick-polls/assets/images/bg-lines.svg") no-repeat right -200px top -270px, radial-gradient(126.4% 101.67% at 0% 0%, #B796FF 0%, rgba(212, 120, 255, 0.00) 100%), #7B6FCF;
    background-blend-mode: overlay;
}

.wp-quick-poll__label {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.70);
}

.wp-quick-poll__question {
    margin-bottom: 10px;
    color: #ffffff;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.20);
}

.wp-quick-poll--star .wp-quick-poll__question,
.wp-quick-poll--lines .wp-quick-poll__question {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
}

.wp-quick-poll--circle .wp-quick-poll__question {
    font-size: 16px;
    line-height: 22px;
    font-weight: bold;
}

.wp-quick-poll__description {
    font-size: 16px;
    line-height: 20px;
    color: #ffffff;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.20);
}

.wp-quick-poll__buttons {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 15px;
}

.wp-quick-poll__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 5px;
    cursor: pointer;
}

.wp-quick-poll__button:hover {
    opacity: 0.8;
}

.wp-quick-poll--star .wp-quick-poll__button,
.wp-quick-poll--lines .wp-quick-poll__button {
    height: 40px;
    font-size: 14px;
    line-height: 1;
    font-weight: bold;
    color: #ffffff;
}

.wp-quick-poll--star .wp-quick-poll__button--yes,
.wp-quick-poll--lines .wp-quick-poll__button--yes {
    height: 40px;
    background-color: #37E3B8;
}

.wp-quick-poll--star .wp-quick-poll__button--no,
.wp-quick-poll--lines .wp-quick-poll__button--no {
    height: 40px;
    background-color: #FF1F00;
}

.wp-quick-poll--circle .wp-quick-poll__button {
    height: 36px;
    font-size: 14px;
    font-weight: bold;
    background-color: #ffffff;
}

.wp-quick-poll--circle .wp-quick-poll__button:before {
    content: "";
    display: block;
    width: 20px;
    height: 18px;
    margin-right: 5px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.wp-quick-poll--circle .wp-quick-poll__button--yes {
    color: #1CCF4F;
}

.wp-quick-poll--circle .wp-quick-poll__button--yes:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='18' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%231CCF4F' d='M19.975 2.096v10.785a1.952 1.952 0 0 1-1.952 1.952h-4.427a.918.918 0 0 0-.483.137l-4.538 2.81a.533.533 0 0 1-.813-.453v-2.12a.374.374 0 0 0-.374-.374H1.952A1.952 1.952 0 0 1 0 12.881V2.096C0 1.018.874.144 1.952.144h16.07c1.079 0 1.953.874 1.953 1.952Z'/%3E%3Cpath fill='%2314B942' d='M3.945 14.833H1.952A1.952 1.952 0 0 1 0 12.881V2.096C0 1.018.874.144 1.952.144h1.993a1.952 1.952 0 0 0-1.951 1.952v10.785c0 1.079.874 1.952 1.951 1.952Z'/%3E%3Cpath fill='%23F5F8F9' d='m17.83 4.365-1.316 4.982a.508.508 0 0 1-.85.23l-.917-.91-2.915 2.935a1.284 1.284 0 0 1-1.766.052L6.769 8.707 4.4 11.564a1.284 1.284 0 1 1-1.976-1.64l3.22-3.882a1.284 1.284 0 0 1 1.844-.137l3.382 3.023 2.057-2.07-.918-.912a.508.508 0 0 1 .225-.85l4.973-1.35a.508.508 0 0 1 .624.62Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .121h20v17.757H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.wp-quick-poll--circle .wp-quick-poll__button--no {
    color: #F35B46;
}

.wp-quick-poll--circle .wp-quick-poll__button--no:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='18' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23F35B46' d='M0 2.085v10.799c0 1.08.875 1.954 1.954 1.954h4.432c.171 0 .339.048.484.138l4.544 2.813a.533.533 0 0 0 .814-.454v-2.123c0-.206.168-.374.374-.374h5.444c1.079 0 1.954-.875 1.954-1.954v-10.8C20 1.007 19.125.13 18.046.13H1.954C.875.13 0 1.005 0 2.085Z'/%3E%3Cpath fill='%23D8513F' d='M3.95 14.838H1.954A1.954 1.954 0 0 1 0 12.884v-10.8C0 1.007.875.13 1.954.13H3.95c-1.08 0-1.954.876-1.954 1.955v10.799c0 1.08.875 1.954 1.954 1.954Z'/%3E%3Cpath fill='%23F5F8F9' d='M17.853 11.768 16.535 6.78a.509.509 0 0 0-.85-.23l-.919.911-2.919-2.939a1.285 1.285 0 0 0-1.768-.052L6.778 7.42 4.405 4.56a1.285 1.285 0 1 0-1.979 1.641l3.225 3.888a1.285 1.285 0 0 0 1.846.137L10.883 7.2l2.06 2.074-.92.912a.509.509 0 0 0 .226.852l4.978 1.351a.509.509 0 0 0 .626-.62Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .13h20v17.74H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.wp-quick-poll__result {
    display: flex;
    align-items: center;
    margin-top: 15px;
}

.wp-quick-poll__result-item,
.wp-quick-poll__result-item-inside {
    display: flex;
    align-items: center;
}

.wp-quick-poll--star .wp-quick-poll__result {
    border-radius: 5px;
    overflow: hidden;
}

.wp-quick-poll--star .wp-quick-poll__result-item {
    flex-grow: 1;
    height: 40px;
    font-size: 14px;
    line-height: 1;
    font-weight: bold;
    color: #ffffff;
}

.wp-quick-poll--star .wp-quick-poll__result-item-inside {
    position: relative;
    padding: 0 15px;
}

.wp-quick-poll--star .wp-quick-poll__result-item--yes {
    justify-content: flex-start;
    background-color: #37E3B8;
}

.wp-quick-poll--star .wp-quick-poll__result-item--no {
    justify-content: flex-end;
    background-color: #FF1F00;
}

.wp-quick-poll--star .wp-quick-poll__result-item-value {
    margin-left: 5px;
}

.wp-quick-poll--lines .wp-quick-poll__result {
    gap: 10px;
}

.wp-quick-poll--lines .wp-quick-poll__result-item {
    justify-content: center;
    position: relative;
    width: 50% !important;
    height: 40px;
    font-size: 14px;
    font-weight: bold;
    color: #ffffff;
    border-radius: 5px;
}

.wp-quick-poll--lines .wp-quick-poll__result-item--yes {
    background-color: #37E3B8;
}

.wp-quick-poll--lines .wp-quick-poll__result-item--no {
    background-color: #FF1F00;
}

.wp-quick-poll--lines .wp-quick-poll__result-item-value {
    margin-left: 5px;
}

.wp-quick-poll--circle .wp-quick-poll__result {
    gap: 10px;
}

.wp-quick-poll--circle .wp-quick-poll__result-item {
    justify-content: center;
    position: relative;
    width: 50% !important;
    height: 36px;
    font-size: 14px;
    font-weight: bold;
    background-color: #ffffff;
    border-radius: 5px;
}

.wp-quick-poll--circle .wp-quick-poll__result-item--yes {
    color: #1CCF4F;
}

.wp-quick-poll--circle .wp-quick-poll__result-item--no {
    color: #F35B46;
}

.wp-quick-poll--circle .wp-quick-poll__result-item-text {
    display: none;
}

.wp-quick-poll--circle .wp-quick-poll__result-item:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 7px;
    width: 20px;
    height: 18px;
    margin-top: -9px;
    margin-right: 5px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.wp-quick-poll--circle .wp-quick-poll__result-item--yes:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='18' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%231CCF4F' d='M19.975 2.096v10.785a1.952 1.952 0 0 1-1.952 1.952h-4.427a.918.918 0 0 0-.483.137l-4.538 2.81a.533.533 0 0 1-.813-.453v-2.12a.374.374 0 0 0-.374-.374H1.952A1.952 1.952 0 0 1 0 12.881V2.096C0 1.018.874.144 1.952.144h16.07c1.079 0 1.953.874 1.953 1.952Z'/%3E%3Cpath fill='%2314B942' d='M3.945 14.833H1.952A1.952 1.952 0 0 1 0 12.881V2.096C0 1.018.874.144 1.952.144h1.993a1.952 1.952 0 0 0-1.951 1.952v10.785c0 1.079.874 1.952 1.951 1.952Z'/%3E%3Cpath fill='%23F5F8F9' d='m17.83 4.365-1.316 4.982a.508.508 0 0 1-.85.23l-.917-.91-2.915 2.935a1.284 1.284 0 0 1-1.766.052L6.769 8.707 4.4 11.564a1.284 1.284 0 1 1-1.976-1.64l3.22-3.882a1.284 1.284 0 0 1 1.844-.137l3.382 3.023 2.057-2.07-.918-.912a.508.508 0 0 1 .225-.85l4.973-1.35a.508.508 0 0 1 .624.62Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .121h20v17.757H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.wp-quick-poll--circle .wp-quick-poll__result-item--no:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='18' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23F35B46' d='M0 2.085v10.799c0 1.08.875 1.954 1.954 1.954h4.432c.171 0 .339.048.484.138l4.544 2.813a.533.533 0 0 0 .814-.454v-2.123c0-.206.168-.374.374-.374h5.444c1.079 0 1.954-.875 1.954-1.954v-10.8C20 1.007 19.125.13 18.046.13H1.954C.875.13 0 1.005 0 2.085Z'/%3E%3Cpath fill='%23D8513F' d='M3.95 14.838H1.954A1.954 1.954 0 0 1 0 12.884v-10.8C0 1.007.875.13 1.954.13H3.95c-1.08 0-1.954.876-1.954 1.955v10.799c0 1.08.875 1.954 1.954 1.954Z'/%3E%3Cpath fill='%23F5F8F9' d='M17.853 11.768 16.535 6.78a.509.509 0 0 0-.85-.23l-.919.911-2.919-2.939a1.285 1.285 0 0 0-1.768-.052L6.778 7.42 4.405 4.56a1.285 1.285 0 1 0-1.979 1.641l3.225 3.888a1.285 1.285 0 0 0 1.846.137L10.883 7.2l2.06 2.074-.92.912a.509.509 0 0 0 .226.852l4.978 1.351a.509.509 0 0 0 .626-.62Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .13h20v17.74H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.wp-quick-poll__close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 16px;
    height: 16px;
    padding: 0;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23fff' fill-opacity='.7' fill-rule='evenodd' d='M7.11 8 .009.898l.89-.89L8 7.111 15.103.008l.89.89L8.89 8l7.102 7.102-.89.89L8 8.889.898 15.992l-.89-.89L7.111 8Z' clip-rule='evenodd'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h16v16H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    border: 0;
    cursor: pointer;
}

.wp-quick-poll__close:hover {
    opacity: 0.8;
}

.wp-quick-poll-wrapper--shortcode .wp-quick-poll__close {
    display: none;
}

/*** Responsive ***/

@media (min-width: 360px) {

    .wp-quick-poll-wrapper--modal {
        left: 15px;
        bottom: 15px;
        max-width: calc(100% - 30px);
    }
}

@media (min-width: 576px) {

    .wp-quick-poll-wrapper--modal {
        max-width: 435px;
    }

    .wp-quick-poll-wrapper--modal.wp-quick-poll-wrapper--circle {
        max-width: 435px;
    }

    .wp-quick-poll-wrapper--modal .wp-quick-poll__buttons,
    .wp-quick-poll-wrapper--modal .wp-quick-poll__result {
        width: 100% !important;
    }
}

@media (min-width: 768px) {

    .wp-quick-poll {
        padding: 15px 30px;
    }

    .wp-quick-poll--star {
        padding-top: 65px;
        background: url("/wp-content/plugins/wp-quick-polls/assets/images/bg-star.svg") #7B6FCF no-repeat right 0 top 0;
    }

    .wp-quick-poll--circle {
        background-position: right -250px top -160px, right 0 top 0;
        background-size: 689px 754px;
    }

    .wp-quick-poll--star .wp-quick-poll__question,
    .wp-quick-poll--lines .wp-quick-poll__question {
        font-size: 22px;
        line-height: 30px;
    }

    .wp-quick-poll--circle .wp-quick-poll__question {
        font-size: 24px;
        line-height: 32px;
    }

    .wp-quick-poll--star .wp-quick-poll__buttons,
    .wp-quick-poll--lines .wp-quick-poll__buttons {
        width: 300px;
    }

    .wp-quick-poll--circle .wp-quick-poll__buttons {
        width: 375px;
    }

    .wp-quick-poll--circle .wp-quick-poll__button {
        height: 40px;
        font-size: 16px;
    }

    .wp-quick-poll--circle .wp-quick-poll__button:before {
        width: 28px;
        height: 24px;
    }

    .wp-quick-poll--star .wp-quick-poll__result {
        width: 300px;
    }

    .wp-quick-poll--lines .wp-quick-poll__result {
        width: 375px;
    }

    .wp-quick-poll--circle .wp-quick-poll__result {
        width: 375px;
    }

    .wp-quick-poll--circle .wp-quick-poll__result-item {
        height: 40px;
        font-size: 16px;
    }

    .wp-quick-poll--circle .wp-quick-poll__result-item:before {
        left: 15px;
        width: 28px;
        height: 24px;
        margin-top: -12px;
    }
}

@media (min-width: 1024px) {

    .wp-quick-poll--circle {
        background-position: right -150px top -160px;
        background-size: 689px 754px;
    }

    .wp-quick-poll--lines {
        background-position: right 0 top -230px, center center;
    }
}