@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

:root{
	--verde: #0B876D;
	--secondario: #D6FD44;
	--nero: #222222;
	--bianco:#FDFDFD;
}

.swiper-container {
			height: 200px;
		}

		.swiper-slide {
			width: 250px;
			height: 200px;
			border: 1px solid lightgray;
		}

		.swiper-slide-active {
			background-color: aliceblue;
		}

		.map_cnt {
			height: 500px;
			margin-top: 8px;
			margin-bottom: 8px;
		}

		#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;
		}

		.foto_cnt img {
			width: 50px;
			margin: 5px;
		}

		.div_error {
			color: red;
			font-weight: bold;
		}

		.modal_calendar_btn {
			position:relative;
		}

		.bootstrap-datetimepicker-widget.dropdown-menu.bottom {
			top: 35px !important;
		}

		.txt_materiali {
			min-height: 100px;
		}

		.pac-container {
			z-index: 2000;
		}

		.address_actions {
			margin-top: 8px;
		}

		.sposta_data {
			min-width: 185px;
		}
		.sposta_orario {
			min-width: 83px;
		}
		.rifiuto_txt {
			min-height: 150px;
		}
		.qr_txt {
			text-align: center;
			width: 256px;
		}
		.form_tab {
			margin-top: 15px;
		}
		
html, body {
	height: 100%; 
	font-family: "DM Sans", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800;}
h1, .h1{font-size: 32px;}
h2, .h2{font-size: 26px;}
h3, .h3{font-size: 24px;}
h4, .h4{font-size: 21px;}
h5, .h5{font-size: 18px;}

a, a:hover, a:focus {
	text-decoration: none;
	color: var(--verde);
	transition: all .3s ease;
	cursor: pointer;
}
.heading small{font-size: 12px;}

.red {
	background-color: #b12424;
	color: #FFF;
	padding: 5px 5px; border-radius: 5px;
}

.bold {
	font-weight: bold;
}

.bg-dark {
	background-color: var(--verde);
	color: white;
}

.nopad {
	padding: 0;
}

.mb5 {
	margin-bottom: 5px;
}

.mb10 {
	margin-bottom: 10px;
}

.mb20 {
	margin-bottom: 20px;
}

.mt10 {
	margin-top: 10px;
}

.pt10 {
	padding-top: 10px;
}

.pointer {
	cursor: pointer !important;
}

.header-row {
	display: flex;
	max-height: 100px;
	align-content: center;
	padding: 5px;
	height: 60px; 
	background: var(--bianco);
}

	.header-row a {
		color: var(--nero);
		display: flex; align-items: center;
		font-size: 16px; font-weight: 600;
	}
	.header-row a:before{content: ''; display: inline-block; width: 14px; height: 17px; background: url(https://junker.blob.core.windows.net/cruscotto/img/user.png) center no-repeat; background-size: contain; margin-right: 3px; background-color: var(--verde); border-radius: 50%; padding: 10px;}

.navigation {
	display: flex;
	flex-direction: column;
	height: auto;
	min-height: auto !important;
	width: 50px;
	position: absolute;
	left: 0;
	top: 20px;
	overflow: hidden;
	transition: width .3s cubic-bezier(.77,0,.18,1); 
	z-index: 998;
	border-radius: 10px;
	margin-left: 10px;
}

.navigation:hover{width: 300px;}

.header-right {
	display: flex;
	width: 100%;
	flex-direction: row;
	justify-content: space-between;
}

.customer-container {
	display: flex;
	align-self: center;
}

.user-actions {
	display: flex;
	align-self: center;
	padding-right: 20px;
}

	.user-actions * {
	/*	margin-left: 20px; */
		align-self: center;
	}

.logo-zebra {
	height: 52px;
}

.logo_header{padding-top: 4px; margin-right: 20px;}

.logo-left {
	display: block;
	height: auto;
	width: 140px;
	margin: 0 10px;
}

.main-row {
	display: flex;
	flex-direction: row;
	flex-grow: 1;
	min-height: 100%;
	position: relative;
}





body.login{background-color: var(--verde);}
	#logo_login{width: 240px; margin: 40px auto;}
		#logo_login img{width: 100%;}

		body.login form{width: 340px; margin: 0 auto;}

		.btn-primary, .btn-default{background-color: var(--secondario); margin: 10px 0; padding: 10px 20px; font-weight: 900; border-radius: 30px;}
		.btn-default{background-color: var(--bianco);}

		body.login p{color: var(--bianco);}
		body.login a, body.login h5{color: var(--bianco);}
		

		.solo_admin{color: #FFF; text-align: center; margin-bottom: 20px;}

		.form-control{border-radius: 10px; padding: 20px 20px; border: 1px solid var(--nero);}
			select.form-control{padding: 6px 12px;}
			
	.btn-primary.btn-arrow-right, .btn-default.btn-arrow-right{background: transparent;}
	
	.btn-primary.btn-arrow-right{color: var(--verde);}


	.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: var(--secondario); 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: "Bricolage Grotesque", 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: "Bricolage Grotesque", 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-lg{width: 90%;}

		.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: "Bricolage Grotesque", sans-serif; color: #596869; margin: 20px 0;}


			.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;}
			
.navigation a {
				color: white;
				height: 40px;
				padding-left: 0;
				width: 300px;
				font-size: 13px;
				display: flex;
				flex-direction: row;
				justify-content: flex-start;
				align-items: center;
				background-size: 25px;
				text-transform: uppercase;
				font-weight: 900;
			}
			.navigation a:before{content: ''; width: 50px; min-width: 50px; height: 20px; display: block; background-size: contain; background-position: center;}		

.navigation a:hover, .navigation a.active{background-color: var(--secondario); color: var(--nero);}

.navigation a:hover:before, .navigation a.active:before{-webkit-filter: invert(100%); filter: invert(100%);}

.tab_header, .tab_header:hover, .tab_header:focus{color: var(--verde) !important;}

.home:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/home.svg) center center no-repeat;
}

.stats:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/stats.svg) center center no-repeat;
}

.cal:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/cal.svg) center center no-repeat;
}

.msg:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/msg.svg) center center no-repeat;
}

.loc:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/loc.svg) center center no-repeat;
}

.amb:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/segn_ambient.svg) center center no-repeat;
}

.ambusr:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/utenti.svg) center center no-repeat;
}

.com:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/com.svg) center center no-repeat;
}

.monistreet:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/monistreet.svg) center center no-repeat;
}

.turistico:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/world.svg) center center no-repeat;
}

.didattico:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/graduation.svg) center center no-repeat;
}

.bac:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/bac.svg) center center no-repeat;
}
.ing:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/ing.svg) center center no-repeat;
}
.ecospedia:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/ecospedia.svg) center center no-repeat;
}

.compost_adm:before{background: url(https://junker.blob.core.windows.net/cruscotto/img/compost3.svg) center center no-repeat;}

.compost_op:before{background: url(https://junker.blob.core.windows.net/cruscotto/img/compost_op.svg) center center no-repeat;}

.junker_actions:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/junker_actions_white.png) center center no-repeat;
}

.docs_repo:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/docs_repo.png) center center no-repeat;
}

.cloak {
	display: none;
}

.verbali:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/verbali.svg) center center no-repeat;
}

.att:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/attrezzature.svg) center center no-repeat;
}

.ingombranti:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/ing.svg) center center no-repeat;
}


.ingombranti_raee:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/ingombranti_raee.svg) center center no-repeat;
}

.sfalci:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/sfalci.svg) center center no-repeat;
}

.servizi_richiesta:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/servizi_richiesta.svg) center center no-repeat;
}

.rs_abiti:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/abiti.svg) center center no-repeat;
}

.rs_ritiri:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/ritiri.svg) center center no-repeat;
}

.rs_natale:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/natale.png) center center no-repeat;
}

.rs_giocattoli:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/giocattoli.png) center center no-repeat;
}

.rs_legno:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/legno.png) center center no-repeat;
}

.rs_oli:before {
	background: url(https://junker.blob.core.windows.net/cruscotto/img/oli.png) center center no-repeat;
}


.active {
	background-color: var(--verde);
}

.flexcol {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	min-height: 100%;
}

.main-content {
	padding: 20px 40px 80px 80px;
	width: 100%;
	position: relative;
}

.msg_errore{height: auto; position: fixed; bottom: 60px; right: 0; left: 0; color: #FFF; font-weight: bold; background: #9f1a1a; padding: 10px 0; display: flex; justify-content: center; align-items: center; z-index: 9999;}
#chiudi_mess_err {
	font-size: 18px;
	font-weight: bold;
	position: absolute;
	right: 10px;
	top: 0;
	bottom: 0;
	color: #FFF;
	background: none;
	border: none;
}

.footer-main{height: 50px; position: fixed; bottom: 0; right: 0; left: 0; background: var(--verde); padding: 0 40px 0 80px; display: flex; justify-content: flex-start; align-items: center; z-index: 9999; flex-direction: row-reverse; display: none;}
	.footer-main .btn{margin-left: 10px;}

	.operazione_in_corso{position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 999; background: rgba(0, 0, 0, 0.6); display: none; align-items: center; justify-content: center; color: #FFF;}
	.operazione_in_corso.ajax{display: flex}
	
	.dati_modificati{position: absolute; z-index: 99; right: 0; top: -40px; padding: 10px; background: #596869; border-radius: 5px 0 0 0; color: #FFF; height: 40px;}

.btn-primary:hover, .btn-primary:active {
	background-color: var(--nero);
	color: var(--secondario);
	border: none;
}

.btn-primary, .btn-primary:focus, .btn-primary[disabled], .btn-primary[disabled]:focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:active, .btn-primary.disabled, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary.disabled:active {
	background-color: var(--secondario);
	color: var(--nero);
	border: none;
}



.btn{font-size: 15px; line-height: 1; display: inline-flex; align-items: center;}

.tab{font-weight: 900; font-family: "Bricolage Grotesque", sans-serif; border: 1px solid var(--nero); padding: 15px;}
.tab.selez{background: var(--secondario);}

.cell_overflow{font-weight: 600; color: var(--verde);}
.badge{background-color: var(--verde);}

.btn_stato{background: transparent; border: none; font-size: 16px; color: #bbb; margin-right: 10px; font-style: italic;}
.btn_stato.btn_stato_attivo{color: var(--verde); font-style: normal; font-weight: 900;}

.btn_stato:after{content: '\27A4'; padding-left: 15px; font-size: 12px;}
.btn_stato:last-child:after{content: ''; padding-left: 0;}


.deseleziona {
  margin-top: 2px;
  float: right;
  font-size: 12px;
  text-decoration: underline;
}


@media (max-width: 768px) {
	.header-row, .header-right {

		max-height: initial;
	}

	.main-row {
		flex-direction: column;
	}

	.navigation-links {
		width: 100%;
		max-width: 100%;
	}

	.navigation a {
		height: 32px;
		max-height: 32px;
	}
}

h1.heading {
	color: var(--nero);
	margin-top: 0;
	margin-bottom: 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.spinner {
	width: 32px;
	height: 32px;
}

.spinner-sm {
	width: 16px;
	height: 16px;
}


button > span.glyphicon, a > span.glyphicon {
	margin-right: 5px;
}

table.highlight > tbody > tr:hover {
	background-color: var(--verde);
	color: white;
	cursor: pointer;
}

.link a {
	display: block;
	margin: 10px;
	color: #000;
}

	.link a span {
		color: var(--verde);
	}

.section_title {
	padding-left: 0px !important;
}

.preview_img {
	margin: 10px;
	margin-left: 0px;
}

	.preview_img img {
		border: solid 1px lightgray;
		width: 100%;
	}
.strillone {
	font-size: 110%;
}
.table_strillone {
	background-color: #efefef;
}
label.checkbox, label.radio {
	min-height: 20px;
	padding-left: 20px;
	margin-bottom: 0;
	font-weight: 400;
	cursor: pointer;
}