﻿
/*.hero {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;
}*/

#bookanappoint .calculator-container {
    position: relative;
    width: 100%;
    max-width: 573px;
    height: auto; /* Adjusted height */
    /*min-width: 320px;*/
    min-height: 410px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /*border: 2px solid rgb(90, 45, 126);*/ /* Border around the calculator */
    border-radius: 12px;
    /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);*/
    /*background: rgba(255, 255, 255, 0.9);*/ /* Slightly transparent white background */
    transition: transform 0.5s ease, opacity 0.5s ease;
}

#bookanappoint .right-aside, #bookanappoint
#result-container {
    position: absolute;
    width: 100%;
    height: 100%;
    /*display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;*/
    box-sizing: border-box;
    /*background: rgba(255, 255, 255, 0.9);*/ /* Consistent background */
    border-radius: 12px;
}

#bookanappoint .right-aside {
    z-index: 1;
    transition: transform 0.5s ease, opacity 0.5s ease;
    flex-direction: column;
}

    #bookanappoint .right-aside h1 {
        font-size: 24px; /* Adjusted font size */
        color: rgb(90, 45, 126);
        font-weight: 600;
        /*margin-bottom: 20px;*/
        text-align: center;
    }

#bookanappoint .input-group {
    margin-bottom: 16px;
    width: 100%;
    /*max-width: 500px;*/
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

    #bookanappoint .input-group label {
        display: block;
        font-size: 13px; /* Adjusted font size */
        margin-bottom: 0px;
        font-weight: 500;
        color: rgb(0 0 0);
        text-align: left;
    }

    #bookanappoint .input-group input {
        /*width: 60%;*/
        height: 2rem;
        padding: 10px; /* Adjusted padding */
        border-radius: 3px; /* Slightly smaller border-radius */
        border: 1px solid rgb(90, 45, 126);
        font-size: 14px; /* Adjusted font size */
        /*margin-bottom: 10px;*/
        box-sizing: border-box;
        transition: border-color 0.3s ease, box-shadow 0.3s ease;
    }

        #bookanappoint .input-group input:focus {
            border-color: #007bff;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
            outline: none;
        }

/*button {
    width: 100%;
    max-width: 500px;
    padding: 10px;*/ /* Adjusted padding */
    /*border-radius: 8px;*/ /* Slightly smaller border-radius */
    /*background: linear-gradient(45deg, rgb(90, 45, 126), rgb(132, 71, 153));
    color: #ffffff;
    border: none;
    margin-top: 10px;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    font-size: 14px;*/ /* Adjusted font size */
/*}

    button:hover {
        background: linear-gradient(45deg, rgb(132, 71, 153), rgb(90, 45, 126));
        transform: translateY(-2px);*/ /* Slightly reduced hover effect */
        /*box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    }

    button:active {
        transform: translateY(0);
    }*/

#bookanappoint #email-message,
#bookanappoint #denials-message,
#bookanappoint #reimbursement-message {
    font-weight: 600;
    /*margin-top: 5px;*/
    font-size: 11px; /* Adjusted font size */
    position: absolute;
    right: 0;
    bottom: -15px;
}

    #bookanappoint #email-message.success,
    #bookanappoint #denials-message.success,
    #bookanappoint #reimbursement-message.success {
        color: #28a745; /* Green color for success */
    }

    #bookanappoint #email-message.error,
    #bookanappoint #denials-message.error,
    #bookanappoint #reimbursement-message.error {
        color: #dc3545; /* Red color for error */
    }

#bookanappoint #result-container.hidden {
    opacity: 0;
    transform: translateX(100%);
    pointer-events: none;
    display: none;
}

#bookanappoint #result-container.show {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
    /*display: flex;
    align-items: flex-start;*/
    padding: 1rem 2rem;
}

#bookanappoint #result-container h2 {
    font-size: 20px; /* Adjusted font size */
    color: rgb(90, 45, 126);
    margin-bottom: 20px;
    font-weight: 600;
    text-align: center;
}

#bookanappoint #result-container p {
    font-size: 16px; /* Adjusted font size */
    margin: 10px 0;
    color: rgb(90, 45, 126);
    font-weight: 500;
    text-align: center;
}
/* Existing CSS remains unchanged */

#bookanappoint .chat-link {
    /*margin-bottom: 20px;*/
    text-align: left;
}

    #bookanappoint .chat-link a {
        color: #023d67; /* Green color for the link */
        text-decoration: underline;
        font-size: 16px; /* Adjust font size */
        font-weight: 700;
    }

        #bookanappoint .chat-link a:hover {
            text-decoration: underline;
            color: #023d67; /* Slightly darker green on hover */
        }

#bookanappoint #calculator-form input[type = email] {
    width: 100%;
    padding: 10px;
    border-radius: 3px;
    border: 1px solid rgb(90, 45, 126);
    font-size: 13px;
    background: #ffffff;
    /* margin-bottom: 10px; */
    box-sizing: border-box;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
#bookanappoint .required {
    color: red;
}
#bookanappoint #calculate-button {
    padding: 0.1rem 1.8rem;
    border-radius: 3px;
    font-size: 13px;
}