/* Mengatur loader */
.star {
    width: 10px;
    height: 10px;
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 50%;
    transform-origin: center bottom;
    animation: custom-spin 1s linear infinite;
}

.star:nth-child(1) {
    transform: rotate(0deg) translateY(-30px);
    animation-delay: 0s;
    background-color: #FF5733;
}

.star:nth-child(2) {
    transform: rotate(51.43deg) translateY(-30px);
    animation-delay: 0.14s;
    background-color: #33FF57;
}

.star:nth-child(3) {
    transform: rotate(102.86deg) translateY(-30px);
    animation-delay: 0.28s;
    background-color: #5733FF;
}

.star:nth-child(4) {
    transform: rotate(154.29deg) translateY(-30px);
    animation-delay: 0.42s;
    background-color: #FFFF33;
}

.star:nth-child(5) {
    transform: rotate(205.71deg) translateY(-30px);
    animation-delay: 0.56s;
    background-color: #33FFFF;
}

.star:nth-child(6) {
    transform: rotate(257.14deg) translateY(-30px);
    animation-delay: 0.7s;
    background-color: #FF33FF;
}

.star:nth-child(7) {
    transform: rotate(308.57deg) translateY(-30px);
    animation-delay: 0.84s;
    background-color: #33FF33;
}

@keyframes custom-spin {
    0% {
        transform: rotate(0deg) translateY(-30px);
    }
    100% {
        transform: rotate(360deg) translateY(-30px);
    }
}

/* -------------------Batas------------------------*/

/* Mengatur tampilan dropdown */
.select2-container--default .select2-selection--single {
    background-color: #ffffff; /* Ganti dengan warna putih */
    border: 1px solid #D1D5DB;
    color: #111827;
    border-radius: 0.375rem; /* Sesuaikan dengan border-radius input */
    height: 2.5rem; /* Sesuaikan dengan height input */
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    padding: 0.625rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    width: 100%; /* Set width to 100% */
}

/* Mengatur tampilan arrow */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    border-color: #D1D5DB;
    margin-top: 0; /* Sesuaikan dengan margin-top input */
    margin-bottom: 0; /* Sesuaikan dengan margin-bottom input */
    vertical-align: middle;
}

/* Mengatur tampilan focus */
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #3F83F8;
    box-shadow: 0 0 0 0.125rem rgba(59, 130, 246, 0.25);
}

/* Mengatur tampilan dropdown menu */
.select2-container--default .select2-results__option {
    color: #111827;
    background-color: #ffffff; /* Ganti dengan warna putih */
    padding: 0.625rem;
}

/* Mengatur tampilan pada hover item dropdown */
.select2-container--default .select2-results__option--highlighted {
    color: #3F83F8;
    background-color: #D1D5DB;
}

/* Mengatur tampilan placeholder */
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #9CA3AF;
}

/* Mengatur tampilan dalam mode gelap (dark mode) */
.dark .select2-container--default .select2-selection--single {
    background-color: #374151;
    border-color: #4B5563;
    color: #ffffff;
}

.dark .select2-container--default .select2-results__option {
    color: #ffffff;
    background-color: #374151;
}

/* Set the container width to 100% */
.select2-container {
    width: 100% !important; /* Set width of Select2 container to 100% */
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-right: 1.75rem; /* Ensures space for the arrow */
}



/* -------------------Batas------------------------*/
/* Mengatur required dan validation form */
form .required::after {
    content: ' *';
    color: red;
}

input.invalid {
    background-color: #ffdddd;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}