/* =========================================================
   RD3 COMPONENTS — FORMS
   Generic form and button components
   ========================================================= */


/* =========================================================
   FORM GROUP
   ========================================================= */

.form-group {

    margin-bottom: 1rem;

}


/* =========================================================
   FORM LABEL
   ========================================================= */

.form-label {

    display: block;

    margin-bottom: 6px;

    font-weight: 600;

    color: #334155;

    font-size: 14px;

}


/* =========================================================
   FORM CONTROL
   ========================================================= */

.form-control {

    display: block;

    width: 100%;

    padding: 10px 12px;

    font-family: inherit;

    font-size: 15px;

    line-height: 1.5;

    color: #1e293b;

    background-color: #ffffff;

    border: 1px solid #cbd5e1;

    border-radius: 6px;

}


/* =========================================================
   FORM CONTROL — FOCUS
   ========================================================= */

.form-control:focus {

    outline: none;

    border-color: #993333;

    box-shadow:
        0 0 0 2px rgba(153, 51, 51, 0.12);

}


/* =========================================================
   BUTTON
   ========================================================= */

.btn {

    display: inline-block;

    padding: 10px 18px;

    border-radius: 6px;

    border: 2px solid transparent;

    font-family: inherit;

    font-size: 14px;

    font-weight: 600;

    text-decoration: none;

    cursor: pointer;

}


/* =========================================================
   PRIMARY BUTTON
   ========================================================= */

.btn-primary {

    background-color: #993333;

    color: #ffffff;

    border-color: #993333;



}


.btn-primary:hover {

    background-color: #7f2929;

    color: #ffffff;

    text-decoration: none;

}


/* =========================================================
   SECONDARY BUTTON
   ========================================================= */

.btn-secondary {

    background-color: #ffffff;

    color: #993333;

    border-color: #993333;

}


.btn-secondary:hover {

    background-color: #f8fafc;

    text-decoration: none;

}