.main{
    width: 40%;
}
label{
    font-size: 1.2rem;
    color: var(--gray);
}

.form-container .form-group.text .form-part.pregunta-textarea{
    min-height: 3em;
    max-height: 10em;
    resize: none;
    field-sizing: content;
}

.form-check-input[type="radio"]:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    background-image: radial-gradient(
        circle,
        var(--white) 0%,
        var(--white) 35%,
        transparent 35%
    );
}

.form-check-input[type="radio"]:focus {
    box-shadow: 0 0 0 0.25rem rgba(46, 138, 203, 0.25);
    border-color: var(--primary-color);
    outline: none;
}
.form-check-input[type="radio"]:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
    border-radius: 50%;
}

.form-check-inline {
    margin-right: 2rem;
}
.btn-form:hover:not([disabled]){
    background-color: var(--tertiary-color);
}

.info{
    color: var(--gray);
    font-size: clamp(0.9rem, 1.3vw, 1.1rem);
    margin-bottom: 1.5em;
}
.form-select {
    display: block;
    width: 100%;
    font-size: 1.2rem;
    border: 2px solid var(--gray-light);
    padding: .7em;
    color: var(--secondary-color);
    border-radius: 5px;
    background-color: transparent;
    transition: all 0.3s ease;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
}

.form-select:focus {
    border-color: var(--primary-color);
    outline: none;
    box-shadow: 0 0 0 0.25rem rgba(46, 138, 203, 0.25);
}

.form-select:disabled {
    background-color: #e9ecef;
    cursor: not-allowed;
}
.form-select option {
    padding: 1em;
    font-size: 1.2rem;
    color: var(--gray);
    background-color: var(--white);
}

.form-select option:hover,
.form-select option:focus,
.form-select option:checked {
    background-color: var(--primary-color);
    color: var(--white);
}

.form-select option:disabled {
    color: var(--gray-light);
    font-style: italic;
}

.form-select option[value=""][disabled] {
    color: var(--gray-light);
}

.btn-update, .btn-cancel, .btn-search {
    background-color: var(--primary-color);
    color: var(--white);
    font-size: 1rem;
    padding: 0.5em 1em;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: all .3s ease;
    outline: none;
}

.btn-update[disabled], .btn-cancel[disabled], .btn-search[disabled] {
    background-color: var(--gray-light);
    cursor: not-allowed;
}

.btn-update:hover:not([disabled]), .btn-cancel:hover:not([disabled]), .btn-search:hover:not([disabled]) {
    background-color: var(--tertiary-color);
}
.btn-delete{
    font-size: 1rem;
    padding: 0.5em .8em;
    border-radius: 5px;
    cursor: pointer;
    transition: all .3s ease;
    border: 3px solid var(--errors);
    color: var(--errors);
}
.btn-delete[disabled]{
    color: var(--gray-light);
    border-color: var(--gray-light);
    cursor: not-allowed;
}

.btn-delete:hover{
    background-color: var(--errors);
    color: var(--white);
}
.btn-close-enable{
    font-size: .8rem;
    border-radius: 50%;
    cursor: pointer;
    transition: all .5s ease-in-out;
    color: var(--gray);
    box-shadow: 0 0 5px .25rem #b1b1b140;
}
.btn-close-enable:hover{
    color: var(--primary-color);
}

@media (max-width: 768px) {
    .logo-container{
        justify-content: center;
    }
    .main{
        width: 80%;
    }
    .disable-form .form-container{
        max-width: 100%;
        width: 100%;
    }
    .disable-form .form-container .form-part.pregunta-textarea{
        resize: vertical;
    }
}
