.erro {
    border: 2px solid red !important;
    background-color: #ffeaea;
}

.shake {
    animation: shake 0.3s;
}

@keyframes shake {
    0% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    50% { transform: translateX(4px); }
    75% { transform: translateX(-4px); }
    100% { transform: translateX(0); }
}


    body {
    background-image: linear-gradient(135deg, transparent 0%, transparent 1%,rgba(13, 90, 227,0.5) 1%, rgba(13, 90, 227,0.5) 34%,transparent 34%, transparent 73%,rgba(39, 220, 232,0.5) 73%, rgba(39, 220, 232,0.5) 100%),linear-gradient(45deg, transparent 0%, transparent 11%,rgb(13, 90, 227) 11%, rgb(13, 90, 227) 62%,rgb(20, 123, 228) 62%, rgb(20, 123, 228) 93%,transparent 93%, transparent 100%),linear-gradient(90deg, rgb(255,255,255),rgb(255,255,255));    }

    .payment-section {
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 2rem;
        margin-bottom: 50px;
    }

    .payment-card {
        max-width: 1000px;
        width: 100%;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
        overflow: hidden;
    }

    .payment-left {
        background: #f1f1f1;
        padding: 2rem;
        text-align: center;
    }

    .payment-left img {
        max-width: 100%;
        border-radius: 8px;
    }

    .price-box {
        margin-top: 1.5rem;
        font-size: 1.5rem;
        font-weight: bold;
        color: #0D6EFD;
    }

    .form-container {
        padding: 2rem;
    }

    .form-container h2 {
        margin-bottom: 1.5rem;
        color: #333;
    }

    .form-container label {
        margin-top: 1rem;
        margin-bottom: 0.3rem;
        color: #444;
        font-weight: 500;
    }

    .form-container input,
    .form-container select {
        width: 100%;
        padding: 0.75rem;
        border-radius: 8px;
        border: 1px solid #ccc;
        font-size: 1rem;
    }

    .form-container button {
        margin-top: 2rem;
        width: 100%;
        padding: 1rem;
        background-color: #4CAF50;
        color: #fff;
        font-size: 1.1rem;
        border: none;
        border-radius: 8px;
        cursor: pointer;
    }

    .form-container button:hover {
        background-color: #218838;
    }

    .btn-voltar {
        width: 98px;
        position: fixed;
        bottom: 30px;
        left: 30px;
        text-decoration: none; 
        padding: 10px; 
        border-radius: 25px; 
        background: #0D6EFD; 
        /* width: 75px;  */
        display: flex; 
        align-items: center; 
        gap: 10px; 
        color: white; 
        font-weight: 700; 
        transition: .2s;

    }

    .btn-voltar:hover{
        background: #0a55c5ff; 

    }

    .nome-curso {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    margin-top: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
}