/* Wrapper de formulario */
.default-abm-form-wrapper {
    display: flex;
    container: form-wrapper / inline-size;
}

.default-abm-form-wrapper.left {
    justify-content: flex-start;
}

.default-abm-form-wrapper.center {
    justify-content: center;
}

.default-abm-form-wrapper.right {
    justify-content: flex-end;
}

.default-abm-form {
    width: 100%;
    margin-bottom: 20px;
}

/* Ancho del formulario segun ancho del wrapper */
@container form-wrapper (width >=600px) {
    .default-abm-form {
        width: 75cqi;
    }
}

@container form-wrapper (width >=800px) {
    .default-abm-form {
        width: 58cqi;
    }
}

@container form-wrapper (width >=1000px) {
    .default-abm-form {
        width: 48cqi;
    }
}

@container form-wrapper (width >=1300px) {
    .default-abm-form {
        width: 40cqi;
    }
}

@container form-wrapper (width >=1500px) {
    .default-abm-form {
        width: 35cqi;
    }
}

/* Legend de un fieldset */
.default-abm-form .default-form-fieldsetlegend {
    margin-bottom: 12px;
    padding-bottom: 2px;
    font-size: 1.7rem;
    font-weight: 700;
    letter-spacing: .25px;
    color: #4a5061;
}

.default-abm-form .default-form-fieldsetlegend a {
    color: #4a5061;
}

/* Field - contenedor de elementos */
.default-abm-form .default-form-field {
    margin-bottom: 20px;
}

/* Labels */
.default-abm-form .default-form-field .default-form-label {
    margin-bottom: 6px;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: .16px;
    color: #656d84;
    user-select: none;
}

.default-abm-form .default-form-field .default-form-label.required::after {
    content: "*";

}

.default-abm-form .default-form-field.has-error .default-form-label {
    color: #a94442;
}

/* Texto de ayuda */
.default-abm-form .default-form-field .default-form-helptext {
    margin: 4px 0 0;
    font-size: 1.2rem;
    letter-spacing: .12px;
    color: #727780;
    user-select: none;
}

.default-abm-form .default-form-field .default-form-errorlist {
    margin: 0;
    padding: 0;
}

.default-abm-form .default-form-field .default-form-errorlist .default-form-errortext {
    margin: 3px 0 0;
    padding-left: 12px;
    font-size: 1.2rem;
    letter-spacing: .12px;
    user-select: none;
}

/* Botones de submit */
.default-abm-form .default-form-wrapper-submit {
    display: flex;
    margin-top: 32px;
}

.default-abm-form .default-form-wrapper-submit input ~ input,
.default-abm-form .default-form-wrapper-submit button ~ button{
    margin-left: 10px;
}

/* Posicionamos el bt submit */
.default-abm-form .default-form-wrapper-submit.left {
    justify-content: left;
}

.default-abm-form .default-form-wrapper-submit.center {
    justify-content: center;
}

.default-abm-form .default-form-wrapper-submit.right {
    justify-content: right;
}

/* Inputs */
.default-abm-form .default-form-field .form-control {
    padding: 6px 12px;
    font-size: 1.6rem;
    color: #23252a;
}

/* Overrides */

/* Checkbox y radio */
.default-abm-form .default-form-field input[type=checkbox],
.default-abm-form .default-form-field input[type=radio] {
    display: block;
    height: 22px;
    width: 22px;
}

/* Select2 Overrides */
.default-abm-form .default-form-field .select2-container .select2-selection {
    height: 35px;
}

.default-abm-form .default-form-field .select2-container .select2-selection.select2-selection--multiple .select2-selection__rendered {
    height: 30px;
    margin: 2px;
    padding: 0;
}

.default-abm-form .default-form-field .select2-container .select2-selection.select2-selection--multiple .select2-selection__choice {
    line-height: 27px;
    margin-top: 0px;
}
