@import "fonts.css";

:root {
    /* PRIMARY COLORS */
    --deep-blue: #000099;
    --impulse-orange: #FE8F11;
    --neutral-gray: #F2F2F2;
    --white: #FFF;

    /* SECONDARY COLORS */
    --lime-green: #84C041;
    --aquamarine: #5BE3D6;
    --azure: #1195eb;
    --azure-20: #8FD4FF;
    --sunny-yellow: #FDC83A;
    --grey-beige: #E2C39A;
    --tarocco: #FC6538;

    /* STATUS COLORS */
    --hover: #0059b9;
    --active: #00348f;
    --disabled: #bfcce3;
    --focus: #00348f;

    /* TYPOGRAPHY COLORS */
    --primary--night-dark-grey: #1c1c1c;
    --secondary--dark-warm-grey: #707070;

    /* TABLE COLORS */
    --warm-gray-90: #48403C; /* th and td color */
    --neutral-gray-40: #BDBDBD; /* th background-color */
    --neutral-gray-10: #E7E7E7; /* td background-color */
}

body {
    color: var(--primary--night-dark-grey);
    font-family: "DIN Pro", sans-serif;
    background-color: var(--neutral-gray);
}

h1, legend {
    color: var(--deep-blue);
    font-family: "MarkOT-Medium", sans-serif;
}

small {
    color: var(--secondary--dark-warm-grey);
}

.btn-senec {
    color: var(--white);
    background-color: var(--deep-blue);
    border-color: var(--deep-blue);
    border-radius: 48px;
    line-height: 1;
    padding: 0.5rem 1rem 0.4rem;
    transition-property: color, background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.btn-senec:hover {
    color: var(--white);
    background-color: var(--hover);
    border-color: var(--hover);
}

.btn-senec:focus {
    color: var(--white);
    background-color: var(--focus);
    border-color: var(--focus);
    box-shadow: unset;
}

/* lowerCamelCase? It's crispy's fault! */
.asteriskField {
    color: var(--impulse-orange);
}

#senec-logo {
    height: 10rem;
}


/* FORM */
form > * {
    margin-bottom: 2rem !important;
}

form input.form-control,
form select.form-control,
form textarea.form-control {
    transition: border-color .3s ease;
}

form input.form-control:focus,
form select.form-control:focus,
form textarea.form-control:focus {
    border-color: var(--focus);
    box-shadow: unset;
}

#div_id_report_date,
#div_id_failure_date,
#div_id_failure_time,
#div_id_work_date,
#div_id_work_hours {
    display: flex;
    flex-wrap: wrap;
}

#div_id_report_date > label,
#div_id_failure_date > label,
#div_id_failure_time > label,
#div_id_work_date > label,
#div_id_work_hours > label {
    flex-basis: 100%;
}

#div_id_report_date > select,
#div_id_failure_date > select,
#div_id_failure_time > select,
#div_id_work_date > select,
#div_id_work_hours > select {
    width: 20%;
    margin-right: 1rem;
}

/* overwrite crispy margin-bottom */
#div_id_parcel_number_spare_parts {
    margin-bottom: 2rem !important;
}

fieldset > fieldset:nth-of-type(-n+4) {
    margin-bottom: 1.2rem;
}
fieldset > fieldset > legend {
    font-size: 1rem;
    font-weight: bold;
}

#submit-id-submit {
    font-size: 1.5rem;
}