/*******************************************************************************
 *                             [Formulario fichar]                             *
 *******************************************************************************/
 html{
    overflow-x: hidden;
 }

#fichaje{
    margin-top: 1.5rem;
    flex-wrap: wrap;
    gap:2rem;
}
.empleado{
    display: flex;
    flex-direction: row;
    gap: .5rem;
    background-color: rgba(200 200 200 /.3);
    border-radius: .3rem;
    padding: .5rem;
    font-size: 2rem;
    align-items: center;
    box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
}

input[type=radio] {
    width: 2rem;
    height: 2rem;
    cursor: pointer;
}

input[type='radio']:hover:before {
    box-shadow: 0px 0px 0px 8px var(--principal);
    border-radius: 50%;
    opacity: 1;
}

input[type=radio]:hover {
    border: 2px solid var(--principal);
    opacity: .6;
}

input[type='radio']:before {
    content: '';
    display: block;
    width: 60%;
    height: 60%;
    margin: 20% auto;
    border-radius: 50%;
}

input[type='radio']:checked:before {
    background: rgb(255, 255, 255, .8);
    box-shadow: 0px 0px 0px 9px var(--principal);
    border-radius: 50%;
}

#campocontra1{
    display: flex;
    flex-direction: row;
    gap:0;
    padding-top: 1rem;
}

#password{
    width: 6rem;
    height: 2.5rem;
    text-align: center;
}

.horafichador{
    margin-top: -1.8rem;
    margin-left: -1.8rem;
    margin-right: -2rem;
    height: fit-content;
    background-color: rgb(255 255 255 /.6);
    border-radius: .3rem;
    padding: .2rem;
    box-shadow: rgb(100 100 111 / 0.2) 0px 7px 29px 0px;
    font-size: 1.2rem;
    font-style: italic;
    color: rgb(50 50 50 / 0.9)
}

.empleado label{
    display: flex;
    flex-direction: row;
}