@font-face {
    font-family: 'Title Font';
    src: url('../assets/fonts/ttf/the-last-shuriken-the-last-shuriken-700.ttf') format('truetype');
}

body {
    color: #8f152d;
    background-image: url('https://res.cloudinary.com/dc1dcxnpt/image/upload/v1742238688/Nave/inscricao_fundo.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100vh;
    width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

h2 {
    font-family: 'Title Font', sans-serif;
}

.form-control, .form-select {
    max-width: 100%;
    transition: border 0.3s, box-shadow 0.3s;
    background-color: white;
    color: black;
    border-color: black;
}

.form-control::placeholder, .form-select::placeholder {
    color: black;
}

.form-label {
    color: #8f152d;
}

.form-check-label {
    color: black;
}

#concordo + .form-check-label {
    color: #8f152d;
}

.form-control:hover, .form-select:hover {
    border-color: #ffab03;
}

.form-control:focus, .form-select:focus {
    border-color: #ffab03;
    box-shadow: 0 0 12px rgba(255, 171, 3, 1);
    outline: none;
    background-color: white;
    color: black;
}


.form-check-input[type="radio"] {
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid black;
    background-color: white;
    position: relative;
    transition: background-color 0.3s, border-color 0.3s;
}

.form-check-input[type="radio"]:checked {
    background-color: #ffab03;
    border-color: #ffab03;
}

.form-check-input[type="radio"]:checked::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: white;
}


.form-check-input[type="radio"]:hover {
    border-color: #ffab03;
    box-shadow: 0 0 12px rgba(255, 171, 3, 1);
}

@media (min-width: 576px) {
    .form-control, .form-select {
        max-width: 100%;
    }

    
}
@media (max-width: 576px) {
    .d-flex.flex-wrap {
        flex-direction: column;
        gap: 5px;
    }
}



.form-box {
    border: 2px solid #ccc;
    border-radius: 8px;
    padding: 2rem;
    max-height: 510px;
    overflow-y: auto;
    background-color: white;
}

.form-select {
    -webkit-appearance: none; 
    -moz-appearance: none;    
    appearance: none;         
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"%3E%3Cpath fill="none" stroke="%23000000" stroke-width="1" d="M3 4l3 3 3-3"%3E%3C/path%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position: right 10px center;
    padding-right: 30px;
}

.form-check-input {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid black;
    transition: background-color 0.3s, border-color 0.3s;
}

.form-check-input:hover {
    border-color: #ffab03;
    box-shadow: 0 0 12px rgba(255, 171, 3, 1);
    
}

.form-check-input:checked {
    border-color: #ffab03;
    background-color: #ffab03;
}

.form-check-input:checked::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: white;
}


.form-box::-webkit-scrollbar {
    width: 8px;
}

.form-box::-webkit-scrollbar-thumb {
    background-color: #ffab03;
    border-radius: 4px;
    border: 2px solid #ffffff;
}

.form-box::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    border-radius: 4px;
}


.form-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
    font-family: 'Title Font', sans-serif;
}

.btn-custom {
    min-width: 120px;
    background-color: white;
    color: #ffab03;
    border: 3px solid #ffab03;
    border-radius: 5px;
}

.btn-custom:hover {
    background-color: #ffab03;
    border-color: #ffab03;
    box-shadow: 0 0 12px rgba(255, 171, 3, 1);
}

.btn-secondary.btn-custom {
    background-color: white;
    border: 3px solid #8f152d;
    color: #8f152d;
}

.btn-secondary.btn-custom:hover {
    background-color: #8f152d;
    border-color: #8f152d;
    box-shadow: 0 0 12px rgb(143, 21, 45, 1);
    color: white;
}

.link-termos {
    color: black;
    text-decoration: none;
    transition: color 0.3s ease-in-out;
}

.link-atualizar {
    color: white;
    text-decoration: none;
    transition: color 0.3s ease-in-out;
    font-family: 'Title Font', sans-serif;
}

.link-termos:hover {
    color: #ffab03;
}

.link-atualizar:hover {
    color: #ffab03;
}

.lupa {
    background-color: white; 
    border: 3px solid #ffab03;
    transition: background-color 0.3s, border-color 0.3s;
}

.lupa:hover {
    background-color: #ffab03; 
    border: 3px solid #ffab03;
    box-shadow: 0 0 12px rgba(255, 171, 3, 1);
}

.lupa i {
    color: #ffab03; 
    transition: color 0.3s;
}

.lupa:hover i {
    color: white;
}