#guestlist .guest {
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 8px;
}

#guestlist .no-reply {
    background-color: #f6eaf4;
}

#guestlist .accepted {
    background-color: #f0f8ff;
}

#guestlist .declined {
    text-decoration: line-through;
}

#guestlist .guest-name {
    font-weight: bold;
    cursor: pointer;
}

#guestlist .guest-details {
    margin-top: 5px;
    display: none;
    /* Hidden by default */
}

.copy-link {
    border: #021934 1px solid;
    border-radius: 3px;
    padding: 3px 6px 3px 6px;
    color: #021934;
    cursor: pointer;
    position: relative;
}

.copy-link:hover {
    background-color: #021934;
    color: #f0f8ff !important;
}

.guest-links {
    display: flex;
    flex-wrap: wrap;
    padding: 16px;
    gap: 16px;
}

.delete-link {
    border: #7c025a 1px solid;
    border-radius: 3px;
    padding: 3px 6px 3px 6px;
    color: #7c025a;
    cursor: pointer;
    position: relative;
}

.delete-link:hover {
    background-color: #7c025a;
    color: #f6eaf4;
}

#guest-info {
    padding: 25px;
}

#guest-info input,
select,
textarea {
    background-color: white;
    border-top: none;
    border-left: none;
    border-right: none;
    border-color: #7c025a;
    border-bottom: 1px solid #7c025a;
    width: 100%;
    padding: 10px;
    font-family: 'Bricolage Grotesque';
}

#guest-info input[type=number],
select {
    max-width: 200px;
}

.copy-link:hover {
    color: #7c025a80;
}

.tooltip {
    visibility: hidden;
    background-color: #fff;
    color: #212121;
    text-align: center;
    border-radius: 5px;
    border: 1px #7c025a solid;
    padding: 1px 5px 1px 5px;
    position: absolute;
    z-index: 4;
    bottom: 125%;
    left: 50%;
    margin-left: -70px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
}

.show-tooltip {
    visibility: visible !important;
    opacity: 1 !important;
}

.conditional-field {
    display: none;
}

.form-icon {
    width: 15px;
}

.white-info {
    background-color: #ffffff90;
    border-radius: 10px;
    border: 1px solid #fff;
    padding: 5px 10px 5px 10px;
    box-shadow: 1px 1px 5px #21212120;
}

.spinner {
    width: 15px;
    height: 15px;
    animation: spin 2s infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
        animation-timing-function: ease-in;
    }

    50% {
        transform: rotate(180deg);
        animation-timing-function: ease-out;
    }

    100% {
        transform: rotate(360deg);
        animation-timing-function: ease-in;
    }
}

#guest-info .submit-button {
    margin-top: 25px;
    padding: 10px 20px;
    font-size: 16px;
    color: #f0f8ff;
    background-color: #003470;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

#guest-info .submit-button:hover {
    background-color: #00347080;
}

#guest-info .submit-button:disabled {
    background-color: #7c025a;
    color: #f6eaf4;
    cursor: not-allowed;
}