/**
 *   @Document   : main.css
 *   @Created on :
 *   @Author     : Virginio Laurini @ Pingitore Informatica
 *   @Description:
 */

/***********************************
* VARIABLES
***********************************/
:root {
    --primary-color: #0d47a1;
    --primary-color-hover: #1976d2;
}

/***********************************
* GENERAL STYLING
***********************************/
body {
    font-family: verdana, helvetica, sans-serif;
    background-color: #f5f5f5;
}

.titolo {
    color: var(--primary-color);
}

.table-header {
    margin: 2px;
}

.table-header tr {
    margin-top: 0 !important;
}

.table-header td {
    background-color: #f5f5f5;
    padding: 0 0;
}

.table-header h1 {
    font-size: xx-large;
    color: darkblue;
    align-self: baseline;
}

.table-header h1.no-login {
    font-size: xxx-large;
    color: darkblue;
    align-self: baseline;

}

/***********************************
* Logos area
***********************************/
div.logo-kronos-container {
    vertical-align: bottom;
    display: inline-block;
    text-align: center;

    background-image: url("/img/logo/logo_kronos.png");
    background-repeat: no-repeat;
    background-size: contain;

    height: 80px;
}

div.logo-kronos-container.no-login {
    height: 120px;
}

img.logo {
    height: 80px;
}


@media only screen and (max-width: 600px) {
    #saluto {
        margin-right: 15px;
    }

    .spacing_navbar {
        margin-top: 15px;
    }

    .table_sm {
        width: 100% !important;
    }
}

img.logo.no-login {
    height: 120px;
}

#logo-pingitore:hover {
    cursor: pointer;
}

/***********************************
* COLORS
***********************************/
.btn-primary {
    background-color: var(--primary-color-hover);
    border-color: var(--primary-color-hover);
}

.btn-primary:hover {
    background-color: var(--primary-color);
}

.bg-primary {
    background-color: var(--primary-color-hover) !important;
}

.text-primary {
    color: var(--primary-color-hover);
}

.bg-std {
    color: white;
    background-color: dodgerblue;
}


/***********************************
* TRASPARENZE
***********************************/
.opacity07 {
    opacity: 0.7 !important;
}

/***********************************
* FONT SIZE
***********************************/
body,
.btn,
.input-group-text,
.form-control {
    font-size: 13px !important;
}

.fsh1 {
    font-size: 1em;
}

/***********************************
* BORDER RADIUS
***********************************/
.btn,
.input-group-text {
    border-radius: 0;
}


/***********************************
* NAVBAR
***********************************/
.navbar {
    background-color: var(--primary-color);
    padding: 0;
}

.navbar .nav-item {
    padding: 4px 6px;
}

.navbar .nav-item.active {
    background-color: var(--primary-color-hover);
}

.navbar .nav-item:hover {
    background-color: var(--primary-color-hover);
}

.navbar .nav-link {
    color: #fff !important;
}

.sub-navbar {
    border-top: 1px solid var(--primary-color-hover);
}


/***********************************
* Classi per evidenziare nelle liste,
* i bambini o gli utenti con data_fine scaduta o nulla
***********************************/
.check_df_null {
    color: blue;
}

.check_df_expired {
    font-style: italic;
    color: red !important;
}

/*************************************
* CUSTOM INPUT AND TEXTAREA FOR FATTURE
*************************************/
.custom-input-fatture {
    margin-bottom: 1px;
    border: none;
    padding: 1px 10px;
    width: 100%;
}

.custom-input-fatture:focus {
    background-color: #f5f5f5;
    outline: none;
}

.custom-textarea-fatture {
    margin-bottom: 4px;
    border: none;
    padding: 4px 10px;
    width: 100%;
    overflow: hidden;
    resize: none;
}

.custom-textarea-fatture:focus {
    background-color: #f5f5f5;
    outline: none;
}

/*************************************
* TOOLBAR
*************************************/
.toolbar_area_xxsmall {
    -ms-flex: 0 0 10px;
    flex: 0 0 10px;
    width: 10px;
    color: brown;
    cursor: pointer;
}

.toolbar_area_xsmall {
    -ms-flex: 0 0 30px;
    flex: 0 0 30px;
    width: 30px;
    color: brown;
    cursor: pointer;
}

.toolbar_area_small {
    -ms-flex: 0 0 60px;
    flex: 0 0 60px;
    width: 60px;
    color: brown;
    cursor: pointer;
}

.toolbar_area_medium {
    -ms-flex: 0 0 90px;
    flex: 0 0 90px;
    width: 90px;
    color: brown;
    cursor: pointer;
}

.toolbar_area_large {
    -ms-flex: 0 0 110px;
    flex: 0 0 110px;
    width: 110px;
    color: brown;
    cursor: pointer;
}

.toolbar_area_xlarge {
    -ms-flex: 0 0 130px;
    flex: 0 0 130px;
    width: 130px;
    color: brown;
    cursor: pointer;
}

.toolbar_area_xxlarge {
    -ms-flex: 0 0 150px;
    flex: 0 0 150px;
    width: 150px;
    color: brown;
    cursor: pointer;
}


/***********************************
* PADDING
***********************************/
.margin-bottom-20 {
    margin-bottom: 20px;
}

/***********************************
* NON-SCROLLABLE TABLE HEADER
***********************************/
.tableFixHead {
    overflow: auto;
    position: sticky;
    top: 40px;
    z-index: 1;
    box-shadow: inset 1px -1px #000;
}


/***********************************
* da rendere generali nel programma
***********************************/
.legend-bambino-modal {
    float: none;
    width: auto;
    margin-left: -5px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 13px;
}


.fieldset-bambino-modal {
    border: 1px solid #ced4da;
}


.fas, .fas:hover {
    cursor: pointer;
}


.bambino-modal-title {
    margin-left: 170px;
}

.modal-title {
    font-size: 18px !important;
}

.corner-bottom-right {
    position: relative;
    top: 45%;
    border-radius: 20%;
}


/***********************************
* Nativamente generali nel programma
***********************************/
/* Rende bianco il background di un campo di input o text_area che sia. Utile se il campo è "disabled" */
.white_field {
    background-color: #fff !important;
}


/* Riempimento a strisce oblique colorate */
.stripe_richiesto {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #41b9ff,
            #41b9ff 20%,
            #1a92f4 20%,
            #1a92f4 40%
    );
}

.stripe_da_approvare {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #417add,
            #417add 20%,
            #1e37c8 20%,
            #1e37c8 40%
    );
}

.stripe_approvato {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #58d553,
            #58d553 20%,
            #169c05 20%,
            #169c05 40%
    );
}

.stripe_negato {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #e95a26,
            #e95a26 20%,
            #d60404 20%,
            #d60404 40%
    );
}

.stripe_alert {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #e9bc26,
            #e9bc26 20%,
            #d68c04 20%,
            #d68c04 40%
    );
}

.stripe_errore {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #d60404,
            #d60404 20%,
            #860202 20%,
            #860202 40%
    );
}

.stripe_purple {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #606dbc,
            #606dbc 20%,
            #465298 20%,
            #465298 40%
    );
}


.stripe_black {
    color: white !important;
    background: repeating-linear-gradient(
            45deg,
            #5a5a80,
            #5a5a80 20%,
            #292d43 20%,
            #292d43 40%
    );
}


.field1z {
    float: left !important;
}

/*CSS by Giada*/
#logo-customer.logo {
    size: auto;
    padding: 10px 10px 0 10px;

}

.form-control {
    border-radius: 0;
}

.cursor_pointer {
    cursor: pointer;
}