/* FORMS - - - - - - - -  */
.sfw-form *:focus {
    color: $primary-color;
    background-color: #fff;
    border-color: $light-color;
    outline: 0;
    box-shadow: 0 0 3px 1px $light-color;
}

.sfw-form fieldset, fieldset.sfw-form {
    border:0;
    margin:0;
    padding:0;
}

.sfw-form input[type='text'],.sfw-form input[type='date'], .sfw-form input[type='number'], .sfw-form input[type='password'], .sfw-form textarea, .sfw-form select, .sfw-form label {
    display: block;
    width:100%;
    padding:0.3rem;
    box-sizing: border-box;
    font-family: var(--ff-secondary);
    font-size: $root-font-size;
}

.sfw-form label {
    margin-bottom:0.2rem;
    font-family: var(--ff-bold-primary);
}

.sfw-form input[type='text'],.sfw-form input[type='date'], .sfw-form input[type='password'], .sfw-form textarea {
    padding:0.3rem;
    border-radius:4px;
    border:1px solid $light-color;
}

.sfw-form textarea {
    height: 11em;
}

.sfw-form input[type='submit'] {
    display: block;
    padding: 0.4rem 0.5rem;
    background-color: $primary-color;
    border:0;
    color:$white-color;
    border-radius:4px;
}

.sfw-form input[type='submit']:hover {
    background-color: $light-color;
    cursor: pointer;
}
 
.sfw-form select {
    padding:0.3rem;
    border-radius:4px;
    border:1px solid $light-color;
    background-color: #fff;
}

.btn {
    padding: 6px 8px;
    border-radius: 4px;
    border:0;
    display: inline-block;
    cursor: pointer;
}

/* tailles de typo */
@each $nom, $size in $font-sizes { 
    .btn-#{$nom} { 
        font-size: $size;
        padding: $size / 3.5 $size / 2;
        border-radius: $size / 4;
    }
}
