/**
 * Style sheet
 * @author Fernando Ferrandino 27-mag-2025
 * Per sostituire l'omnicomprensivo main.css
 */

.grid-container_1 {
    display: 				grid;
    grid-template-rows: 	1fr 1fr; /* 1 equal rows */
    height: 				30px;
    border: 				1px solid #aaa;
    background-color: 	hsl(220, 100%, 30%);
    color:					#fff;
}

.grid-container_2 {
    display: 				grid;
    grid-template-rows: 1fr 1fr; /* 2 equal rows */
    height: 				40px;
    border: 				1px solid #aaa;
    background-color: hsl(220, 100%, 30%);
    color:					#fff;
}

.grid-item {
    border-bottom: 			1px solid #ccc;
    padding: 				5px 5px 5px 5px;
    max-width: 				900px;
}

.dati-riconoscimento {
	width: 					60%;
    text-transform: 		uppercase;
    box-sizing: 			border-box;
	border-radius:			3;
	color:					#fff;
}

.image-container {
    display: 				flex;
    justify-content: 		center; /* center horizontally */
    gap: 					20px;   /* space between images */
	margin: 				14px 0 0px -84px;
}

/*GENERAL BUTTON*/

.login-button {
	display:				flex;
	margin-left:			-30px;
	align-items:			center;
	justify-content:		center;
	line-height: 			1;
	text-decoration: 		none;
	font-family: 			"Titillium Web", sans-serif;
	font-size: 				15px;
	text-transform: 		uppercase;
	width: 					100px;
	height: 				30px;
	border: 				1px solid #687589;
	position: 				relative;
   background-color:		hsl(220, 100%, 30%);
   border-color:			hsl(220, 100%, 10%);
   color:					#fff;
	border-radius: 6px;
}

.button-container {
	display: 				flex;
	justify-content: 		center;  /* centers the buttons horizontally */
	gap: 					140px;                /* space between buttons */
	padding: 				20px;
}

.button-container button {
	padding: 				20px 40px;
	font-size: 				16px;
}

    .form-container {
      display: 				grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 					16px;
      max-width: 			1000px;
      margin: 				20px 10px 15px 50px; /* Top, Right, Bottom, Left (clockwise) */
    }

    .form-container_2 {
      display: 				grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 					16px;
      max-width: 			40%;
      margin: 				-5px 0px 15px 100px;
    }

    .form-container_3 {
      display: 				grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 					16px;
      max-width: 			40%;
      margin: 				-5px 0px 15px 100px;
    }

    .form-container_4 {
      display: 				grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 					16px;
      max-width: 			40%;
      margin: 				-5px 0px 15px 100px;
    }

    .form-container_5 {
      display: 				grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 					16px;
      max-width: 			35%;
      margin: 				20 20 100 0;
    }

    .form-group {
      display: 				flex;
      flex-direction: 		column;
      align-items: 			flex-start; /* Align label and input to the left */
    }

    .form-container_login {
      display: 				grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 					16px;
      max-width: 			1200px;
      height: 				80px;
      margin: 				0 auto 100 0;
    }

	/* Per una veloce suddivisione di una barra in tre sezioni*/
    .section {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 				80px;
    }
    .left   { background: #4CAF50; }
    .middle { background: #2196F3; }
    .right  { background: #FF5722; }

	 .checkbox-container {
		border: 						1px solid #ccc;
		padding: 					5px;
	   height: 						40px;
		width: 						450px;
		border-radius: 			8px;
		background-color: #f9f9f9;
	}

   label {
      font-weight: 				bold;
      margin-bottom: 		4px;
    }

	label.recuperoPwd {
		font-size:				9px;
		font-weight:			500;
      width: 					100%;
	}

	a.recuperoPwd {
		cursor:				pointer;
		font-size:			8pt;
		width:					40px;	
	}

    input[type="text"], input[type="email"], input[type="number"], input[type="password"] {
      width: 					100%;
      padding: 				6px;
      box-sizing: 			border-box;
      border-radius:		3;
    }

    input[name="invioCodice-input"] {
		width: 					45px;
		height: 					20px;
      color:						green;
		font-size:				10px;
      border-radius:		3;
    }

    input[name="data_nascita"], input[name="prov_nascita"] , input[name="prov_residenza"], input[name="data_inizio_carica"], input[name="data_fine_carica"] {
      width: 					60%;
      padding: 				6px;
      text-transform: 	uppercase;
      box-sizing: 			border-box;
      border-radius:		3;
    }

    input[name="nome_tit"], input[name="cognome_tit"], input[name="comune_nascita"], input[name="indirizzo_residenza"] , input[name="comune_residenza"] {
      width: 				100%;
      padding: 				6px;
      text-transform: 		uppercase;
      box-sizing: 			border-box;
      border-radius:		3;
    }

    .upload-icon-cv, .upload-icon-ci, .upload-icon-al, .delete-icon-cv ,.delete-icon-ci {
      cursor: 				pointer;
      width: 				24px;
    }

    .view-file-cv, .view-file-ci, .view-file-al {
      text-decoration: 	underline;
      text-transform:		lowercase;
	  cursor: 					pointer;
	  width: 						24px;
    }

    .hidden-input {
      display: 				none;
    }

   table.operatoreIvc, table.allegatiIvc, table.anagraficaIvc {
      border-collapse: 	collapse;
      width:						auto;
      margin: 					0px 0px 30px 0px;
 		font-size:				10px;
   }

	table.operatoreIvc th, table.allegatiIvc th, table.anagraficaIvc th {
	    vertical-align:		middle;
	    border-collapse:	collapse;
	    border:					0px dotted #a9a9a9;
	    padding:				10px;
	    font-family:			serif;
	    font-style:			normal;
	    font-size:				13px;
	    font-weight:			bold;
	    color:				hsl(220, 100%, 30%);
    	background-color:	#fff;
	}

	table.operatoreIvc tr.odd{
	    background-color:	transparent; /*#ebfbea; /* #e3fbe2; #d4fbd3;   */
	    font-size:			6px;
	}

	table.operatoreIvc tr.even {
	    background-color:	rgb(229, 238, 218);  /*#e9fbfa; #ffffe9; #f0fbfb;*/
	    font-size:			13px;
	}

	table.datiEnte{
	    vertical-align:		middle;
	    text-align:			left;
	    border-collapse:	collapse;
	    border:					1px solid #a9a9a9;
	    padding:				10px;
	    margin-bottom: 	0px;
	}

	tr.even {
	    background-color:	rgb(229, 238, 218);  /*#e9fbfa; #ffffe9; #f0fbfb;*/
	    font-size:				12px;
	    font-style:				oblique;
	}

	table.datiEnte td{
	    vertical-align:			middle;
	    text-align:				left;
	    border-collapse:		collapse;
	    border:					1px solid #a9a9a9;
	    padding:				10px;
	    font-family:			serif;
	    font-size:				13px;
	    font-weight:			bold;
	    margin-bottom: 		0px;
	}

    td.allegatiIvc, td.operatoreIvc {
        border: 			1px solid #ccc;
        padding: 			12px;
        text-align: 		left;
 		font-size:			10px;
    }

    th.allegatiIvc img {
        width: 			16px;
        height: 			16px;
        vertical-align: middle;
        margin-right: 6px;
 		font-size:		10px;
    }


	.datiEnte label{
		font-family: 		"Titillium Web", sans-serif;
		font-size:			14px;
	    font-weight:		bold;
      	text-decoration: 	underline;
	} 

	table.allegatiIvc th label, table.operatoreIvc th label {
	   	font-size:				12pt;
	}
	
	.view-ente, .hide-ente{
		display:				none;
	    font-family:		serif;
	    font-size:			13px;
	} 

	.view-ente:focus, .hide-ente:focus {
		background-color: red;
		text-decoration: 	underline;
	}

	.not-display{
		display:				none;
	} 

	.curs-hand{
		cursor: 				pointer;
	} 

 .input-search-login {
	font-size: 				13px;
	line-height: 			15px;
	font-weight: 			400px;
	font-family: 			"Titillium Web", sans-serif;
	text-transform: 		none;
	background-color: #fff;
	color:					#364760;
}

.highlight {
	font-size: 				15px;
	background-color: yellow;
        color: red;
        font-weight: bold;
    }

/* Styles for the input / textarea when FOCUSED */
input, textarea, .input-search-login:focus {
	background-color:	 rgb(229, 238, 218); 
	/* #e8f0fe  A light blue color  rgb(229, 238, 218)    rgb(175, 203, 144) light green 
											rgb(230, 230, 235) 
		*/
    border-color:			 rgb(175, 203, 144);   /*  #4a90e2 A darker blue for the border */
    
    /* Optional: Remove the default browser outline if you have a custom border/shadow */
    outline: none;
}

.readonly-style {
  background-color:	#f0f0f0;
  color:						#555;
}

.font-13 {
	font-size: 				13px;
}
.font-13_b {
    font-weight:			bold;
	font-size: 				13px;
}

 /**  Ada - Titolari  ***/
.editable, .download, .deletable, .deletable_ope, .delete-icon-tipdoc, .delete-icon-all {
	cursor: 					pointer;
}

.input-edit {
  border-radius:			3;
	width: 					100px;
}

.input-ivc {
  	height: 				30px;
  	border-radius:	4px;
	text-transform:	uppercase;
}


.news-section {
    width: 90%;
    max-width: 1200px;
    margin: 40px auto;
    font-family: Arial, sans-serif;
}

.news-title {
    text-align: center;
    margin-bottom: 25px;
    font-size: 28px;
    color: #333;
}

.news-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 25px;
}

.news-card {
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

.news-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.news-img {
    width: 100%;
    height: 180px;
    object-fit: cover;
}

.news-content {
    padding: 15px;
}

.news-date {
    font-size: 12px;
    color: #888;
}

.news-card-title {
    margin: 8px 0;
    font-size: 20px;
    color: #222;
}

.news-text {
    font-size: 14px;
    color: #555;
}

.news-link {
    display: inline-block;
    margin-top: 10px;
    color: #0077cc;
    text-decoration: none;
    font-weight: bold;
}

.news-link:hover {
    text-decoration: underline;
}