/**
 * 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: 						25px;
    border: 						1px solid #aaa;
    background-color: 	hsl(220, 100%, 30%);
    color:							#fff;
}


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

.grid-container_2 .top {
    grid-column: 1 / 3; /* span both columns */
}

.grid-item {
	 flex-direction: 		row;        /* 👈 horizontal */
	 align-items: 			left;        /* vertical alignment */
	 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: 		80%;
      margin: 				20 20 100 0;
    }

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

	  /* grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); */
	.form-container_6 {
  display: grid;
  grid-template-columns: 1fr 1fr 30px 1fr 1fr 1fr; /* 👈 3rd column small */
  gap: 16px;
  max-width: 80%;
  margin: 20px 20px 100px 0;
	}

	.icon-column {
	  display: 				flex;
	  flex-direction: 	column;
	  align-items: 		center;
	  justify-content: center;
	  gap: 					8px;
	}
	.form-group-row {
	  display: 			flex;
	  flex-direction: row;        /* 👈 horizontal */
	  align-items: 	center;        /* vertical alignment */
	  gap: 				8px;                   /* space between label and input */
	}
    
    .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;
    }

   .warning {
   		color:				hsl(220, 100%, 30%);
   }
   
   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;
}

.highlightOK {
	font-size: 					25px;
	background-color: rgb(175, 203, 144);
   font-weight: 				bold;
}

.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-12 {
	font-size: 				12px;
}
.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;
}

.disabledContent 
{
    cursor: not-allowed;
    background-color: rgb(229, 229, 229) !important;
    pointer-events:none;
}

.msg {
  width: 					50%;
  padding: 				10px 15px;
  margin: 				25px 0;
  border-radius: 	5px;
  font-size: 			14px;
  display: 				flex;
  align-items:			center;

  white-space:		nowrap;       /* FORZA UNA SOLA RIGA */
  overflow:				hidden;          /* nasconde overflow */
  text-overflow:	ellipsis;   /* ... se troppo lungo */
}

/* varianti */
.msg-success {
  background-color: #d4edda;
  color:						#155724;
}

.msg-error {
  background-color: #f8d7da;
  color:						#721c24;
}

.msg-info {
  background-color: #d1ecf1;
  color: 						#0c5460;
}