﻿html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { background: transparent; border: 0; margin: 0; padding: 0; vertical-align: baseline; }


:root{--blue: #115289; --celeste: #00B6C0; height: 100%;}


h1, h2, h3, h4, h5, h6 { clear: both; font-weight:normal; padding: 0 0 0 0; margin-bottom:0px; line-height:1.1; font-weight: bold;}
	h1{ font-size:21px; }
	h2{ font-size:18px; }
	h3{ font-size:16px; }
	h4{ font-size:14px; }
	h5{ font-size:13px; }

p{ font-size:14px;  line-height:1.4; padding:0 0 3px 0; font-weight:inherit; color: #596869;}
p a, label a{text-decoration: underline;}
ol, ul { list-style-position: inside; list-style-type: disc;}
img{width: 100%; margin: 0; height: auto; padding: 0;}
a img { border: none;}
a, a:hover {text-decoration:none; color: var(--celeste);}
a:hover {}
hr{ border:none; border-top:1px dotted #000; font-size:1px; height:0px; padding:0px; display:block; margin:5px 0;}
/*button{display: block; font-size: 13px; background: transparent; color: #FF9900; border: 1px solid #FF9900; padding: 20px; width: 200px; border-radius: 32px; margin: 10px auto;}*/
.left{ float:left; }
.center{text-align: center;}
.myClear{clear:both; padding:0; margin:0; font-size:0px; height:0px; font-size:0px; display:block; }
.myRow {display: block; clear: both; padding:5px 0; margin: 0;}
.myIn {margin: 0 auto; width: 90%; padding: 0;}

*::-webkit-scrollbar {width: 0px; background: transparent;}

.col_1_2{width: 50%; display: block; float: left;}
.col_2_3{width: 66.6%; display: block; float: left;}
.col_1_3{width: 33.3%; display: block; float: left;}

*{outline: none; -webkit-tap-highlight-color: transparent;}

input, textarea{width: 100%; background: #FFF; border-radius: 10px; padding: 15px 20px; box-sizing: border-box; font-size: 18px; border: 1px solid #ddd; color: #1c1c1c; display: block; -webkit-appearance: none; font-family: 'Roboto', sans-serif;}

textarea{resize: none;}
select{width: 100%; max-width: 300px; background: #FFF; border-radius: 10px;  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); padding: 15px 20px; box-sizing: border-box; font-size: 18px; border: 1px solid #ededed; margin: 10px auto 20px auto; color: #1c1c1c; display: block; -webkit-appearance: none;}


textarea{height: 100px;}
input::placeholder, textarea::placeholder{color: #c6c6c6;}

	
body{background: #FFF; font-size:14px; line-height:1.3; font-family: 'Roboto', sans-serif; font-weight: 400; color: #596869; height: 100%;}


#header_user{background: var(--blue); padding: 20px 0; display: flex; align-items: center; justify-content: space-between;}
	.logo{width: 150px; }


#contenitore{padding: 20px; box-sizing: border-box; display: flex; height: 100%; position: relative;}
	
.main{width: 80%; height: 100%; padding-right: 10px; box-sizing: border-box;}	
.sidebar{width: 20%; height: 100%; padding-left: 10px; box-sizing: border-box;}
	
	.info{padding: 10px 20px; border-radius: 10px; border: 1px solid #dddddd; color: #B23B3B; column-count: 3; width: 100%; height: 10%; box-sizing: border-box;}
	
	.map_e_list{display: flex; width: 100%; height: 70%;}
		.map, .list{width: 50%; padding: 10px 0 0 0; box-sizing: border-box;}
	
	
	.list_items_cnt{ border-radius: 10px; border: 1px solid #dddddd; padding: 10px 0; box-sizing: border-box; height: 100%; max-height: 100%; overflow: scroll;}
	
		.list_item{padding: 15px 20px 10px 20px; box-sizing: border-box; border-bottom: 1px solid #ddd;}
			.list_item.selected_item{background-color: #D8FFFA;}
	
			.list_head{display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;}
				.list_head h2{color: var(--blue);}
				.list_head span{font-weight: bold;}
			
			
			.list_orario{display: flex; align-items: center; justify-content: space-between;}
				.list_orario span{color: var(--celeste);}
				.list_orario label{display: flex; align-items: center;}
					.list_orario label input{margin-left: 10px; padding: 5px 15px; width: auto; max-width: none;}
				.list_orario button{background: var(--celeste); color: #FFF; height: auto; width: auto; margin: 0; padding: 8px 10px; border: none;}
	
	
	
	
	
	
	.cal_giornaliero{width: 100%; align-self: flex-end; height: 100%; padding: 0; box-sizing: border-box;}
	.legenda{overflow: hidden;}
		.legenda ul{list-style: none;}
			.legenda ul li{padding: 5px 0; white-space: nowrap;}
				.legenda ul li.square_blu:before, .legenda ul li.square_verde:before{content: ''; width: 14px; height: 14px; border-radius: 2px; display: inline-block; background: var(--blue); vertical-align: middle; margin-right: 5px;}
				.legenda ul li.square_verde:before{background: #269318;}



		.appuntamenti{height: calc(100% - 60px); width: 100%;}
			.appuntamenti_head{background: var(--blue); padding: 10px; box-sizing: border-box; color: #FFF; font-size: 18px; text-align: center; font-weight: bold; margin-top: 4px;}
				.appuntamenti_head span{display: block;}
				.appuntamenti_head a{font-size: 14px; font-weight: normal; text-decoration: underline;}



			.appuntamenti_cnt{position: relative; height: calc(100% - 110px); overflow-y: scroll; border: 1px solid #ddd; border-radius: 0 0 10px 10px; padding: 10px 10px 0 10px; box-sizing: border-box;}
				.orario{height: 60px; border-top: 1px solid #ddd;}
					.orario span{background: #FFF; margin-top: -9px; display: block; width: 45px;}
	
			.slot_appuntamento{position: absolute; margin-top: 10px; left: 55px; right: 0; padding: 10px; color: #FFF; display: flex; align-items: center; justify-content: space-between;}
				.slot_appuntamento.confermato{background-color: #269318;}
				.slot_appuntamento.non_confermato{background-color: var(--blue);}

				.slot_appuntamento a{background: var(--celeste); color: #FFF; height: auto; width: auto; margin: 0; padding: 5px 15px; border: none; display: block; border-radius: 20px;}

			
			.conferma_action{text-align: center; margin-top: 7px;}
			.conferma_action a{background: #269318; padding: 10px 20px; color: #FFF; border-radius: 20px; text-align: center; display: inline-block;}


/* --- inizio css custom --- */
span.glyphicon {
    margin-right: 5px;
}

.err_lbl {
    color: red;
    font-weight: bold;
}

.bg-dark {
    background-color: #115289;
    color: white;
}

.header-row {
    display: flex;
    max-height: 100px;
    height: 80px;
}

    .header-row a {
        color: #8CCCC5;
    }

.navigation {
    display: flex;
    flex-direction: column;
    width: 270px;
    min-width: 270px;
    max-width: 540px;
}

    .navigation a {
        color: white;
        height: 56px;
        padding-left: 50px;
        width: 100%;
        font-size: 16px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        background-size: 25px;
    }

        .navigation a:hover {
            background-color: #8CCCC5;
        }

.logo-left {
    display: block;
    height: auto;
    width: 200px;
    margin: 8px auto 0 auto;
}

.header-right {
    display: flex;
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
}

.main-row {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    min-height: 100%;
}

.flexcol {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    min-height: 100%;
}

.home {
    background: url(//ade.blob.core.windows.net/admin/img/home.png) 15px center no-repeat;
}

.main-content {
    padding: 10px 10px;
    width: 100%;
}

.user-actions {
    display: flex;
    align-self: center;
    padding-right: 20px;
}

    .user-actions * {
        margin-left: 20px;
        align-self: center;
    }

.customer-container {
    display: flex;
    align-self: center;
}

.active {
    background-color: #61AD8A;
}

@media (max-width: 768px) {
    .header-row, .header-right {
        flex-direction: column;
        max-height: initial;
    }

    .main-row {
        flex-direction: column;
    }

    .navigation-links {
        width: 100%;
        max-width: 100%;
    }

    .navigation a {
        height: 32px;
        max-height: 32px;
    }
}

/* --- slider --- */
.swiper-container {
    height: 200px;
}

.swiper-slide {
    width: 250px;
    height: 200px;
    border: 1px solid lightgray;
}

.swiper-slide-active {
    background-color: aliceblue;
}

.swiper-slide {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    border-radius: 5px;
    overflow-x: hidden;
    overflow-y: auto;
}

    .swiper-slide.today .day_info:after {
        content: 'Oggi';
        display: block;
        position: absolute;
        bottom: 10px;
        text-align: center;
        background: #8CCCC5;
        color: #FFF;
        padding: 5px;
        border-radius: 3px;
        font-size: 12px;
    }


.day_info {
    width: 20%;
    text-align: center;
    padding: 0 10px;
    box-sizing: border-box;
    height: 100%;
    border-right: 1px solid #EDEDED;
    border-left: 4px solid #BFBFBF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: sticky;
    top: 0;
    bottom: 0;
}


.today .day_info {
    border-left: 4px solid #8ccbc5;
}

.day_app_count {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #596869;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: block;
    text-align: center;
    color: #FFF;
}

.day_name {
    font-size: 15px;
    text-transform: capitalize;
    color: #596869;
}

.day_number {
    font-size: 22px;
    font-weight: bold;
    font-family: 'Montserrat', sans-serif;
    color: #596869;
}

.day_app_list {
    width: 80%;
    padding: 0 5px;
    box-sizing: border-box;
}

.single_app {
    display: flex;
    padding: 3px 0;
    border-bottom: 1px solid #EDEDED;
}

.app_orario {
    padding-right: 5px;
    box-sizing: border-box;
    font-weight: bold;
}



.marker_info_cnt {
    padding: 20px;
    border: 1px solid #dfdfdf;
    border-radius: 10px;
    box-sizing: border-box;
    margin: 10px 0;
}

.marker_info_name {
    font-size: 18px;
    font-weight: bold;
    font-family: 'Montserrat', sans-serif;
    color: #596869;
}

.marker_info_tel, .marker_info_email {
    display: inline-block;
    vertical-align: middle;
}

    .marker_info_email a {
        text-decoration: underline;
        margin-left: 5px;
    }


.marker_info_desc {
    font-weight: bold;
    margin: 5px 0;
}

.sel_day {
    margin: 5px 0;
}


.marker_info_orario_cnt a {
    float: right;
    display: block;
    margin: 10px 0 0 5px;
    padding: 10px 20px;
    color: #FFF;
    background: #8CCCC5;
    border-radius: 5px;
    cursor: pointer;
}

.marker_info_orario_cnt:after {
    clear: both;
    height: 0;
    content: '';
    display: block;
    font-size: 0;
    padding: 0;
    margin: 0;
}

.marker_info_app_cnt {
    text-align: center;
    margin: 10px 0;
    background: #EDEDED;
}


.day_past {
    padding: 3px;
    background: #ffb2b2;
}

.marker_info_orario_cnt a.btn_rifiuta {
    background: #d64242;
}

.modal-title {
    font-weight: bold;
    text-transform: capitalize;
}

.modal_count {
    background: #596869;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    color: #FFF;
    font-weight: normal;
}



.marker_info_rifiuto_cnt {
    margin: 10px 0;
}

    .marker_info_rifiuto_cnt a {
        margin: 5px;
        float: right;
        text-decoration: underline;
        display: block;
    }

.rifiuto_btn_conferma {
    color: #d64242;
}

.modal_app_annulla {
    padding: 7px 10px;
    background: #d64242;
    margin-left: 5px;
    border-radius: 5px;
}

    .modal_app_annulla a {
        color: #FFF;
    }



.modal_app_dati, .modal_app_azioni {
    display: flex;
    align-items: flex-end;
    padding: 5px 0;
    box-sizing: border-box;
}


.modal_app_nome, .modal_app_tel, .modal_app_email, .modal_app_materiali, .modal_app_indirizzo {
    padding-right: 40px;
    box-sizing: border-box;
}

.modal_app {
    padding: 20px;
    border-bottom: 1px solid #d2d2d2;
}

.modal_app_foto a {
    width: 90px;
    height: 120px;
    display: inline-block;
}

    .modal_app_foto a img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }


.modal_app_notifica {
    margin-left: 20px;
}

.modal_app_sposta {
    margin-left: auto;
    display: flex;
    width: 40%;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.sposta_data {
    margin-right: 10px;
}

.sposta_azioni {
    flex: 0 0 100%;
    text-align: right;
}

    .sposta_azioni a {
        display: inline-block;
        margin: 20px 0 20px 40px;
    }

.action_annulla {
    color: #d20d0d;
}


.notifica_inviata {
    padding: 5px;
    background: #15b023;
    color: #FFF;
    text-align: center;
    font-size: 12px;
    border-radius: 5px;
}


.btn-group-xs > .btn, .btn-xs {
    padding: 5px;
}

.div_ricordati {
    color: #c51e1e;
    font-style: italic;
}

.modal_app_ritirato {
    background: url(https://junker.blob.core.windows.net/cruscotto/img/check_ritiro.svg) 15px center no-repeat;
    background-size: 15px 15px;
    padding-left: 16px;
    background-position: left;
    margin: 3px 10px;
    color: #15b023;
}

.app_ritirato {
    background: url(https://junker.blob.core.windows.net/cruscotto/img/check_ritiro.svg) 15px center no-repeat;
    background-size: 15px 15px;
    padding-left: 16px;
    background-position: center center;
    margin: 0 0 0 auto;
    color: #15b023;
}

.modal_app_mancato_ritiro {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    width: 300px;
    color: #d10000;
    margin: 0 20px;
    border: 1px solid #eaeaea;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 10px;
}

    .modal_app_mancato_ritiro img {
        width: 90px;
        height: auto;
        margin-left: 10px;
    }

.top_month_name {
    font-size: 22px;
    font-weight: bold;
    font-family: 'Montserrat', sans-serif;
    color: #596869;
    margin: 20px 0;
}

#curr_month_div {
    text-transform: capitalize;
    position: relative;
    display: inline-block;
    width: 261px;
}

#next_month_div {
    text-transform: capitalize;
    position: relative;
    display: inline-block;
    width: 250px;
}


.swiper-slide-active {
    background-color: #EDFFF7;
}


.summary_cnt {
    display: flex;
    align-content: center;
    justify-content: space-around;
    background: #eaeaea;
    margin-top: 10px;
}

.summary_single {
    width: auto;
    margin: 10px 5px 10px 5px;
    text-align: center;
}


.punti_attenzione {
    padding: 20px;
    box-sizing: border-box;
    border: 1px solid #dfdfdf;
    border-radius: 10px;
    margin: 10px 0;
}


.close {
    font-size: 28px;
    opacity: .8;
}


.modal_app_ritiro_passato {
    margin: 0 5px;
}

.pointer {
    cursor: pointer;
}