.raffle-fancybox .fancybox-content {
    max-width: min(90vw, 600px);
    margin: 0 auto;
    padding: 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.raffle-title {
    font-size: 1.5rem;
    color: green;
    margin-bottom: 10px;
}

.raffle-controls {
    cursor: pointer;
}

.raffle-controls input[type="radio"]:checked+label {
    background: var(--hover-button-background) !important;
}
.raffle-controls label {
    margin-top: 0 !important;
    margin-bottom: 40px !important;
}

.raffle-fancybox .raffle-numbers {
    margin-top: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 5px;
    /* flex-wrap: wrap; */
}

@media(max-width: 500px) {
    .raffle-fancybox .raffle-numbers {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        grid-gap: 3px;
    }
    .raffle-fancybox .raffle-numbers .raffle-number {
        padding: 0px 2px;
    }
}

.raffle-number,
.raffle-number:focus {
    padding: 5px 10px;
    margin: 5px;
    background: #f0f0f0;
    border: 1px solid #ddd;
    cursor: pointer;
    color: black;
}

.raffle-number.used {
    background: #a9a9a9 !important;
    color: #fff !important;
    cursor: not-allowed;
}

.raffle-number.used.current,
.raffle-number.used.current:hover,
.raffle-number.used.current:focus {
    background: var(--button-background) !important;
    color: white !important;
}

.raffle-tag {
    display: inline-block;
    padding: 5px 10px;
    margin: 5px;
    background: var(--button-background) !important;
    color: #fff;
    border-radius: 5px;
}

.raffle-tag .remove-tag {
    margin-left: 5px;
    color: #fff;
    cursor: pointer;
    background: var(--button-background) !important;
    padding: 2px 10px;
}

.raffle-fancybox .raffle-tags-container {
    display: flex;
    flex-wrap: wrap;
    max-width: min(450px, 100vw);
}

.manual-pick-container {
    padding-top: 24px;
    border-top: 1px solid var(--ast-border-color);
}

.manual-pick-container h4 {
    padding-top: 16px;
}

.picked-raffle-numbers-container {
    border: 1px solid var(--ast-border-color);
    margin-top: 16px;
    padding: 16px;
}

/** Pagination **/
.raffle-fancybox .raffle-pagination .pagination-controls {
    text-align: center;
}

.raffle-fancybox .raffle-pagination .pagination-controls span {
    margin-left: 16px;
    margin-right: 16px;
}

.raffle-fancybox .raffle-pagination .pagination-controls button {
    padding: 10px 15px !important;
}

.raffle-header {
    margin-bottom: 10px;
    text-align: center;
}

.raffle-search {
    width: 80%;
    padding: 10px;
    font-size: 1rem;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin: 0 auto;
    display: block;
}