/* ===================================
   BARBERPRO
   FORMULARIOS GENERALES
=================================== */


/* ===================================
   CAMPOS GENERALES
=================================== */


input,
select,
textarea{

    width:100%;

    padding:10px 12px;

    border:1px solid #e5e7eb;

    border-radius:10px;

    outline:none;

    background:#fff;

    font-size:14px;

    box-sizing:border-box;

    transition:.2s;

}



input:focus,
select:focus,
textarea:focus{

    border-color:#2563eb;

    background:#fff;

}



/* ===================================
   LABELS
=================================== */


label{

    display:block;

    margin-bottom:6px;

    font-weight:600;

    color:#374151;

    font-size:14px;

}



/* ===================================
   GRUPOS DE FORMULARIO
=================================== */


.form-group{

    margin-bottom:14px;

}



.form-group small{

    font-size:12px;

    color:#6b7280;

}



/* ===================================
   BOTONES FORMULARIOS
=================================== */


button,
.btn{

    cursor:pointer;

    border:none;

    font-weight:600;

    transition:.2s;

}



.btn:hover{

    opacity:.9;

}



/* BOTON VERDE PRINCIPAL */

.btn.green{

    background:#16a34a;

    color:white;

}



/* BOTON ROJO */

.btn.red{

    background:#ef4444;

    color:white;

}



/* BOTON AZUL */

.btn.blue{

    background:#2563eb;

    color:white;

}



/* ===================================
   CHECKBOX Y RADIO
=================================== */


input[type="checkbox"],
input[type="radio"]{

    width:auto;

    margin-right:6px;

    cursor:pointer;

}



/* ===================================
   MENSAJES
=================================== */


.error{

    background:#fee2e2;

    color:#b91c1c;

    padding:10px;

    border-radius:10px;

    font-size:14px;

    margin-bottom:15px;

}



.success{

    background:#dcfce7;

    color:#166534;

    padding:10px;

    border-radius:10px;

    font-size:14px;

    margin-bottom:15px;

}



/* ===================================
   TEXTAREAS
=================================== */


textarea{

    min-height:90px;

    resize:vertical;

}



/* ===================================
   MOVIL
=================================== */


@media(max-width:768px){


    input,
    select,
    textarea{

        font-size:14px;

        padding:9px 10px;

    }


    label{

        font-size:13px;

    }


}