/*=======================================================barra dei menu====================================================*/

.navbar {
    background-color: #9A616D;
}


/*icone del menu quando collassa*/

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")!important;
}


/*Voci di menu della barra dei menu*/

.navbar-brand {
    color: #fcf5f5 !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 1rem !important;
}

.nav-link {
    color: #000000 !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 1rem !important;
}

.nav-link:hover {
    color: #f3f7f3 !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 1rem !important;
}


/*testo intestazione barra dei menu*/

.nav-testo {
    float: left;
    font-style: italic;
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    color: #fcf5f5 !important;
}


/*testo link dropdown menu*/

.dropdown-item {
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    color: #000000 !important;
    background-color: #ffaa00;
}

.dropdown-item:hover {
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    color: #ffffff !important;
    background-color: #595959;
}


/*===========================================================================================================*/

.section-color {
    background-color: #e9dee1;
}

.icon-color {
    color: #473939;
}

.header-form {
    padding-left: 5px;
    padding-top: 0px;
    padding-right: 10px;
    height: 40px;
    background-color: #000000;
    text-align: center;
}

.img-header {
    float: left;
    margin-left: 5px;
}

.label-login {
    color: #6b6a6a;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8rem;
    margin-bottom: 1px;
}

.text-header {
    position: relative;
    margin-bottom: 2px;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9rem;
    color: #ffffff;
    text-align: center;
    line-height: 40px;
    margin-left: -50px;
}

.text-login {
    font-family: 'Roboto', sans-serif;
    font-size: 0.9rem;
    height: 30px;
    border: none;
    border-bottom: 1px solid #8f5e69;
    outline: none;
    box-shadow: none !important;
    padding-left: 10px;
    padding-right: 10px;
    color: black;
    background-color: #f2f2f2;
}

.text-login:focus {
    background-color: #e2e2e2;
    border-color: #8f5e69;
    border-radius: 0.25rem;
    color: #000000;
    border-bottom: 1px solid #e69e04;
}


/*==================== CASELLA DI TESTO COME LABEL===========================================================*/

.textmodal-as-label {
    background-color: #ffffff;
    border: none;
    border-bottom: 0px solid #e9dee1;
    height: 30px;
    padding-top: 2px;
    color: #000000;
    text-align: center;
}

.textmodal-as-label:focus {
    border-color: inherit;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.textmodal-as-label:read-only {
    background-color: #ffffff;
}


/*==================================================*/

.text-as-label-clinica {
    background-color: #e9dee1;
    border: none;
    border-bottom: 0px solid #e9dee1;
    height: 30px;
    padding-top: 2px;
    text-align: center;
    font-weight: bold;
    /*color:#535353;*/
    color: #000000;
}

.text-as-label-clinica:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    text-align: center;
    font-weight: bold;
}

.text-as-label-clinica:read-only {
    background-color: #ffffff;
}

.text-as-label {
    background-color: #e9dee1;
    border: none;
    border-bottom: 0px solid #e9dee1;
    height: 30px;
    padding-top: 2px;
    /*color:#535353;*/
    color: #000000;
}

.text-as-label:focus {
    border-color: inherit;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.text-as-label:read-only {
    background-color: #ffffff;
}

.combobox {
    background-color: #e9dee1;
    border: 1px solid #a39296;
    height: 30px;
    padding-top: 3px;
    font-family: Arial;
    font-size: 14px;
    color: #000000 !important;
}

.combobox:focus {
    border: 1px solid #9A616D;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-small-verde {
    width: 52px;
    height: 30px;
    display: inline-block;
    cursor: pointer;
    color: #101010;
    font-family: Arial;
    font-size: 12px;
    border-radius: 0px;
    border: 1px solid #7bad37;
    background: #7bad37;
}

.btn-small-verde:hover {
    background-color: #76b320;
    border: 1px solid #76b320;
    color: #464444;
}

.btn-small-rosa {
    width: 52px;
    height: 30px;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: Arial;
    font-size: 12px;
    border-radius: 0px;
    border: 1px solid #9A616D;
    background: #9A616D;
}

.btn-small-rosa:hover {
    background-color: #a15a6a;
    border: 1px solid #a15a6a;
    color: #464444;
}

.btn-modal-close {
    padding-top: 5px;
    color: #ffffff;
}

.btn-grid {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
    height: 30px;
    width: 30px;
    padding: 0px 6px;
    border: none;
    border-radius: 0px;
    background: #9A616D;
    font: normal normal bold 11px arial;
    color: #000000;
    text-decoration: none;
    cursor: pointer;
}

.btn-clinica {
    display: inline-block;
    background-color: #9A616D;
    position: relative;
    width: 138px;
    height: 35px;
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 1px;
    padding-top: 4px;
    cursor: pointer;
    white-space: nowrap;
    border-radius: 0px;
    border: 1px solid #9A616D;
    color: #ffffff;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    text-align: center;
}

.btn-clinica:hover {
    display: inline-block;
    background-color: #ffffff;
    position: relative;
    width: 138px;
    height: 35px;
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 2px;
    padding-top: 4px;
    cursor: pointer;
    white-space: nowrap;
    border-radius: 0px;
    border: 1px solid #9A616D;
    color: #000000;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    text-align: center;
}

.btn-small-erase {
    width: 30px;
    height: 30px;
    display: inline-block;
    cursor: pointer;
    color: #101010;
    font-family: Arial;
    font-size: 12px;
    border-radius: 0px;
    border: 1px solid #9A616D;
    background-color: #9A616D;
}

.btn-small-erase:hover {
    background-color: #9e5363;
    border: 1px solid #9e5363;
    color: #ffffff;
}

.btn-femmina {
    display: inline-block;
    float: right;
    text-align: center;
    vertical-align: middle;
    height: 30px;
    width: 58px;
    text-align: center;
    vertical-align: middle;
    padding: 4px 10px;
    border: 1px solid #9A616D;
    border-radius: 1px;
    background-color: #9A616D;
    font-family: 'Roboto', sans-serif;
    font-size: 1.08rem;
    font-style: italic;
    color: black;
    text-decoration: none;
}

.btn-femmina:hover {
    background-color: #9e5363;
    border: 1px solid #9e5363;
    color: #ffffff;
}

.btn-maschio {
    display: inline-block;
    float: right;
    text-align: center;
    vertical-align: middle;
    height: 30px;
    width: 58px;
    text-align: center;
    vertical-align: middle;
    padding: 4px 10px;
    border: 1px solid #7bad37;
    border-radius: 1px;
    background-color: #7bad37;
    font-family: 'Roboto', sans-serif;
    font-size: 1.08rem;
    color: black;
    text-decoration: none;
}

.btn-maschio:hover {
    background-color: #76b320;
    border: 1px solid #76b320;
    color: #ffffff;
}

.btn-conferma {
    display: inline-block;
    float: right;
    height: 30px;
    margin-top: 0px;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    padding: 2px 10px;
    border: 1px solid #343a40;
    border-radius: 1px;
    background-color: #343a40;
    font-family: 'Roboto', sans-serif;
    font-style: italic;
    font-size: 0.9rem;
    font-style: italic;
    color: #fff;
    text-decoration: none;
}

.btn-conferma:hover {
    background-color: #23272b;
    border: 1px solid #23272b;
    color: #ffffff;
}

.btn-prepara {
    display: inline-block;
    float: right;
    height: 30px;
    margin-top: 0px;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    padding: 2px 10px;
    border: 1px solid #9A616D;
    border-radius: 1px;
    background-color: #9A616D;
    font-family: 'Roboto', sans-serif;
    font-style: italic;
    font-size: 1.08rem;
    font-style: italic;
    color: #fff;
    text-decoration: none;
}

.btn-prepara:hover {
    background-color: #9e5363;
    border: 1px solid #9e5363;
    color: #ffffff;
}


/*===========================================================================================================*/


/*RIMUOVE LO SPAZIO FRA LE COLONNE DELLA GRIGLIA*/

.row.no-gutter {
    margin-left: 0;
    margin-right: 0;
}

.row.no-gutter [class*='col-']:not(:first-child),
.row.no-gutter [class*='col-']:not(:last-child) {
    padding-right: 0;
    padding-left: 0;
}


/*====================================================CSS HEADER FIXED======================================================*/


/*TABELLA RUBRICA RESPONSIVE OK*/

.customers {
    font-family: Tahoma, Geneva, sans-serif;
    border-collapse: collapse;
    width: 100%;
    overflow: auto;
    font-style: normal;
    font-size: 0.9rem;
    /*for horizontal and vertical scroll bars */
    /*height: 600px;*/
}

.customers td,
.customers th {
    border: 1px solid #a5a2a3;
    padding: 6px;
}

.customers tr:nth-child(even) {
    background-color: #a7989b;
}

.customers tr:hover {
    background-color: #ffffff;
}

.customers th {
    /* barra intestazione tabella*/
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: center;
    background-color: #a5878d;
    color: #000000;
    font-style: normal;
    font-size: 0.9rem;
    font-weight: 500;
}


/*CSS HEADER FIXED*/

.customers header-fixed {
    position: fixed;
    top: 50px;
    z-index: 1020;
    /* 10 less than .navbar-fixed to prevent any overlap */
}


/*
	Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically.
	*/

@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {
    /*allarga in altezza le textarea quando lo schermo si riduce*/
    .rowtextarea {
        min-height: 10vh;
    }
    /* Force table to not be like tables anymore */
    table,
    thead,
    tbody,
    th,
    td,
    tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    tr {
        margin: 0 0 1rem 0;
    }
    tr:nth-child(odd) {
        background: #ccc;
    }
    td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
    }
    td:before {
        /* Now like a table header */
        content: attr(data-label);
        /*float: left;*/
        width: 50%;
        padding-right: 10px;
        white-space: nowrap;
        display: inline-block;
    }
    /*
		Label the data
    You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
		*/
    /*INTESTAZIONE COLONNE QUANDO LA TABELLA COLLASSA*/
    /*td:nth-of-type(1):before {}*/
    td:nth-of-type(2):before {
        content: attr(data-label);
    }
    td:nth-of-type(3):before {
        content: attr(data-label);
    }
    td:nth-of-type(4):before {
        content: attr(data-label);
    }
    td:nth-of-type(5):before {
        content: attr(data-label);
    }
    td:nth-of-type(6):before {
        content: attr(data-label);
    }
    td:nth-of-type(7):before {
        content: attr(data-label);
    }
    td:nth-of-type(8):before {
        content: attr(data-label);
    }
    td:nth-of-type(9):before {
        content: attr(data-label);
    }
    td:nth-of-type(10):before {
        content: attr(data-label);
    }
    td:nth-of-type(11):before {
        content: attr(data-label);
    }
    td:nth-of-type(12):before {
        content: attr(data-label);
    }
    td:nth-of-type(13):before {
        content: attr(data-label);
    }
    td:nth-of-type(14):before {
        content: attr(data-label);
    }
}

td.azioni {
    white-space: nowrap;
}

.color-box-ore {
    /*background: linear-gradient(145deg, #ffaa00, #b07500);*/
    background-color: #f2e9d7;
    padding: 6px;
    padding-right: 100px;
    border-radius: 0px;
}

.color-box {
    border-radius: 1px;
    background: linear-gradient(145deg, #daec71, #b8c75f);
}


/* fine tabella rubrica*/