/*
Theme Name: xtheme
Template: twentytwentyfour
Author: the WordPress team
Domain Path: /languages
Description: Questo è un tema figlio per il tema Twenty Twenty-Four con personalizzazioni.
Version: 1.0.0
*/

@import url('../twentytwentyfour/style.css');

body .site {
    padding: 0 40px;
    padding: 0 2.857142857rem;
    margin-top: 48px;
    margin-top: 3.428571429rem;
    margin-bottom: 48px;
    margin-bottom: 3.428571429rem;
    box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
}

/* Custom Login Page Styling */
body.login {
    background: #ffffff
}

.login form {
    background-color: #ffa500; /* Form colore arancione sbiadito */
    border-radius: 10px; /* Bordi arrotondati */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Ombra leggera */
    padding: 30px; /* Aumenta padding per più spazio interno */
    max-width: 500px; /* Aumenta la larghezza massima del form */
    margin: auto; /* Centra il form */
    position: relative; /* Per posizionare l'immagine */
}

.login form label {
    color: #ffffff; /* Colore testo */
    font-weight: bold; /* Grassetto */
}

.login #login_error, .login .message {
    border-left-color: #ffa500; /* Colore bordo messaggio */
    background-color: #fff4e5; /* Sfondo messaggio */
    border-radius: 5px; /* Bordi arrotondati messaggio */
    padding: 10px; /* Aggiungi padding ai messaggi */
}

/* Nascondi il logo di WordPress perché l'abbiamo sostituito con l'immagine personalizzata */
.login h1 a {
    background-image: url('https://xbitsrl.it/wp-content/uploads/2024/04/LogoXBIT.png'); /* Immagine personalizzata */
    background-size: contain;
    width: 100%;
    height: 100px; /* Altezza dell'immagine */
    margin-bottom: 20px; /* Spazio tra l'immagine e il form */
}


/* Personalizza i pulsanti */
.login .button-primary {
    background-color: #ffffff; /* Colore pulsante arancione */ /* Colore bordo pulsante */
    color: #ffa500; /* Colore testo pulsante */
    border-radius: 10px; /* Bordi arrotondati pulsante */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Ombra pulsante */
    padding: 10px 20px; /* Aggiungi padding ai pulsanti */
    text-transform: uppercase; /* Testo maiuscolo */
    font-weight: bold; /* Grassetto */
	border-color: #ffa500;
}

/* Stile per il pulsante di login al passaggio del mouse */
.login .button-primary:hover {
    background-color: #636363; /* Colore pulsante al passaggio del mouse */
    border-color: #636363; /* Colore bordo pulsante al passaggio del mouse */
}

/* Stile per il pulsante di login quando viene cliccato */
.login .button-primary:active {
    background-color: #000000; /* Colore pulsante quando viene cliccato */
    border-color: #000000; /* Colore bordo pulsante quando viene cliccato */
}

/* Stile per il pulsante di login una volta cliccato e focalizzato */
.login .button-primary:focus {
    background-color: #ffffff; /* Colore pulsante quando viene cliccato e focalizzato */
    border-color: #FFA500; /* Colore bordo pulsante quando viene cliccato e focalizzato */
	color: #FFA500;
}



/* Aggiungi l'immagine dell'omino al campo username */
.login form .input[type="text"] {
    background: url('https://xbitsrl.it/user.png') no-repeat 10px center, #fff;
    background-size: 20px 20px, auto;
    padding-left: 40px; /* Spazio per l'icona e il testo */
}

/* Aggiungi l'immagine del lucchetto al campo password */
.login form .input[type="password"] {
    background: url('https://xbitsrl.it/lock.png') no-repeat 10px center, #fff;
    background-size: 20px 20px, auto;
    padding-left: 40px; /* Spazio per l'icona e il testo */
}

/* Stili aggiuntivi per migliorare l'aspetto degli input */
.login form .input {
    height: 40px; /* Altezza degli input */
    border: 1px solid #ccc; /* Bordo degli input */
    border-radius: 5px; /* Bordi arrotondati */
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.1); /* Ombra interna */
    background-color: #fff; /* Assicurarsi che lo sfondo rimanga bianco */
}

/* margine tolto sotto alla navigazione*/
#wp--skip-link--target{
	margin-block-start: 0;
}

/*colore del menu navigazione mobile*/
#modal-1{
	background: #f9f9f9;
}

/*colore del menu navigazione mobile*/
body > div > div > header > div {
	background: #f9f9f9;
}

.wpdt-c button, .wpdt-c input, .wpdt-c optgroup, .wpdt-c select, .wpdt-c textarea {
    margin: 3px;
}

.wpdt-c *, .wpdt-c *:active, .wpdt-c *:hover, .wpdt-c *:focus {
    white-space: nowrap;
}


/*scritte a capo nelle tabelle*/
.expand {
	text-wrap: wrap !important;
    word-break: normal;
    
}

.wpDataTablesWrapper table.wpDataTable td{
    white-space: normal;
}

.wpDataTablesWrapper table.wpDataTable>thead>tr>th {
    white-space: normal;
}


#bottoneEliminaDevice {
    width: 94px;
}

div> #table_1 > tbody> tr> td.column-download {
	text-align: center !important;
}
div> #table_2 > tbody> tr> td.column-2 {
	text-align: center !important;
}

div> #table_3 > tbody> tr> td.column-1 {
	text-align: center !important;
}

#table_1:not(.wpDataTableID-1) .expand {
	text-wrap:wrap!important;
    word-break: break-all;
    
}

#formDispositivi {
    display: flex;
    flex-flow: wrap;
    width:100%;
    margin: 0px;
    column-gap: 30px;
    justify-content: space-between;
	align-items: center;
}

#formDispositiviNome {
	display: flex;
	justify-content: flex-start;
    flex: 1 1 auto;
    order: 1;
	align-items: center;
}
#formDispositiviNome label{
	order: 1;
	flex: 0 0 auto;
}
#formDispositiviNome select{
	order: 2;
	flex: 1 1 auto;
}
#formDispositiviNome input{
	order: 2;
	flex: 1 1 auto;
}

#formDispositiviSN {
	display: flex;
	justify-content: flex-start;
    flex: 1 1 auto;
    order: 2;
	align-items: center;
}
#formDispositiviSN label{
	order: 1;
	flex: 0 0 auto;
}
#formDispositiviSN input{
	order: 2;
	flex: 1 1 auto;
}

#bottoneDispositivi {
    flex: 0 0 auto;
    order: 3;
	background-color: #ffa500;
	color: #ffffff;
}
#bottoneSalva {
    flex: 0 0 auto;
    order: 3;
	background-color: #ffa500;
	color: #ffffff;
}
#bottoneElimina {
    flex: 0 0 auto;
    order: 3;
	background-color: #ffa500;
	color: #ffffff;
}

#bottoneAggiungi {
    flex: 0 0 auto;
    order: 4;
	background-color: #ffa500;
	color: #ffffff;
}

@media screen and (max-width: 600px) {
  #formDispositivi {
    display: flex;
    flex-flow: column;
    width:100%;
    margin: 0px;
    row-gap: 5px;
    justify-content: space-between;
	align-items:flex-start;
	}
	#formDispositiviNome {
	width:100%;
	display: flex;
	justify-content: flex-start;
    flex: 1 1 auto;
    order: 1;
	align-items: center;
	}
	#formDispositiviNome label{
		order: 1;
		flex: 0 0 5rem;
	}
	#formDispositiviNome select{
		order: 2;
		flex: 1 1 auto;
	}
	#formDispositiviNome input{
	order: 2;
	flex: 1 1 auto;
	}

	#formDispositiviSN {
		width:100%;
		display: flex;
		justify-content: flex-start;
	    flex: 1 1 auto;
	    order: 2;
		align-items: center;
	}
	#formDispositiviSN label{
		order: 1;
		flex: 0 0 5rem;
	}
	#formDispositiviSN input{
		order: 2;
		flex: 1 1 auto;
	}
	
	#bottoneDispositivi {
    flex: 0 0 auto;
    order: 3;
	background-color: #ffa500;
	color: #ffffff;
	}
	#bottoneSalva {
	    flex: 0 0 auto;
	    order: 3;
		background-color: #ffa500;
		color: #ffffff;
	}
	#bottoneElimina {
	    flex: 0 0 auto;
	    order: 3;
		background-color: #ffa500;
		color: #ffffff;
	}
}

.wp-element-button, .wp-block-button__link {
    background-color: #ffa500;
}



.wp-element-button, .wp-block-button__link {
	font-size: 10px;
}

body header > .wp-container-core-group-layout-1 {
	width: 100%;
	justify-content: center;
}
body header nav.wp-block-navigation.wp-block-navigation-is-layout-flex{
	flex: 0 1 auto;
	margin-left: 10px;
}
/* LINGUA */
.dropdown {
    position: relative;
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    height: 60px;
    flex: 0 1 auto;
}
.dropdown > #bottoneLingua {
	display: flex;
	flex:  0 0 auto;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-evenly;
	background-color: #f1f1f1;
	width: 85px;
	border-radius: 4px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	height: 40px;
	margin-top: 10px;
	/* margin-bottom: 15px; */
}

.dropbtn{
	height: 20px;
	padding: 0px;
	width: 30px;
	font-size: larger;
	border: none;
	display: flex;
	justify-content: center;
	align-items: center;
    color: #808080;
}
.dropbtn:focus {
    outline: none;
}

#bandieraSelezionata {
    max-width: 40px;
    /* margin-right: 5px; /* Margine a destra dell'immagine */
}

#hiddenDropdown {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    width: 85px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    /*padding: 4px 0; /* Ridotto ulteriormente il padding verticale */
    border-radius: 4px;
    height: 40px;
    top: 60px; /* Posizionato leggermente sopra il pulsante */
    /*left: 0;*/
}

.dropdown:hover #hiddenDropdown {
    display: flex;
	flex-flow: row nowrap;
	align-items: center;
}

.dropdown-content a {
    color: #808080;
     /* Ridotto il padding verticale e mantenuto orizzontale */
    text-decoration: none;
    width: 30px;
    text-align: center;
    font-size: larger;
}
.dropdown-content a:focus {
    outline: none;
}


.dropdown-content a img {
    max-width: 30px;
    margin-right: 10px;
}



.language-option {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-evenly;
    gap: 10px;
}

.language-option img {
    max-width: 36px;
     /* Margine a destra dell'immagine */
    padding-right: 1.5px;
    padding-left: 2px;
}

/* Centrare verticalmente la scritta con l'immagine nella dropdown principale */
.language-option .dropbtn {
    display: flex;
    align-items: center;
}


body{
	font-family: "Jost", sans-serif;
}
/*
#wp--skip-link--target > div > div.yoast-breadcrumbs {
    
    color: #ffa500;
    MAX-WIDTH: none !important;
    width: 100%;
    margin-block-start: 0rem !important;
    left: 0;
}

#wp--skip-link--target > div > div.yoast-breadcrumbs > span{
    padding-left: var(--wp--preset--spacing--50);
}
*/
/*
.barradinavigazione > span > span > a {
	color: #ffa500;
}
*/

#wp--skip-link--target > div > div.yoast-breadcrumbs.barradinavigazione > span {
	font-size: 13px;
    color: #808080;
}

#wp--skip-link--target > div > div.yoast-breadcrumbs.barradinavigazione > span > span:nth-child(1) > a{
    color: #808080;
}


.yoast-breadcrumbs.barradinavigazione {
    --wp--style--global--content-size: 1250px;
}

/* Arrotondare i bordi e cambiare il colore del bordo quando il collegamento è selezionato o in focus */
a:not(#lingua):not(#files):focus, a:not(#lingua):not(#files).selected,
.wp-block-navigation-item__label:not(#lingua):not(#files):focus, 
.wp-block-navigation-item__label:not(#lingua):not(#files).selected {
    border: 2px solid #FFA500; /* Bordo arancione */
    border-radius: 7px; /* Arrotonda i bordi */
    outline: none; /* Rimuove il bordo predefinito di focus */
}

/* Cambiare il colore della sottolineatura quando il collegamento è in hover o focus */
a:not(#lingua):not(#files):hover, a:not(#lingua):not(#files):focus,
.wp-block-navigation-item__label:not(#lingua):not(#files):hover, 
.wp-block-navigation-item__label:not(#lingua):not(#files):focus {
    text-decoration: underline;
    text-decoration-color: #FFA500; /* Colore della sottolineatura arancione */
    color: #FFA500; /* Colore del testo arancione, se desiderato */
}

/* Cambiare il colore della sottolineatura per il collegamento selezionato */
a:not(#lingua):not(#files).selected,
.wp-block-navigation-item__label:not(#lingua):not(#files).selected {
    text-decoration: underline;
    text-decoration-color: #FFA500; /* Colore della sottolineatura arancione */
}




@media (min-width: 920px) and (max-width: 991px) {
    .cc-hide-on-tablet {
        display: initial !important;
        /* Puoi anche aggiungere altre proprietà per sovrascrivere quelle esistenti */
    }
}

/*
.wp-block-site-logo img {
    height: auto;
    max-width: max-content;
}
*/


body > div {
	font-family: "Jost", sans-serif;
}

/* Stile predefinito dei bottoni */
.wp-block-button__link.wp-element-button {
  background-color: #ffa500; /* Colore di sfondo arancione */
  color: white; /* Colore del testo bianco */
  border: none; /* Nessun bordo predefinito */
  padding: 10px 20px; /* Spaziatura interna */
  text-align: center; /* Allineamento del testo */
  text-decoration: none; /* Nessuna sottolineatura */
  display: inline-block; /* Visualizzazione in linea con margini */
  border-radius: 5px; /* Angoli arrotondati */
}

/* Stile quando il mouse passa sopra il bottone */
.wp-block-button__link.wp-element-button:hover {
  background-color: #ffa500; /* Colore di sfondo arancione al passaggio del mouse */
  color: white; /* Colore del testo bianco al passaggio del mouse */
}

/* Stile quando il bottone è cliccato */
.wp-block-button__link.wp-element-button:active {
  background-color: #ffa500; /* Colore di sfondo arancione quando cliccato */
  color: white; /* Colore del testo bianco quando cliccato */
  box-shadow: 0 0 0 2px black; /* Ombra per simulare un bordo nero */
}


.wp-block-latest-posts.is-grid.articoliNews li {
    margin: 0px;
    border-radius: 10px;
    padding: 10px;
    border: 5px solid #ffa500;
    transition: border 0.3s ease;
    transition: background-color 0.3s ease;
    text-align: center;
    align-content: center;
    user-select: none;
}

.wp-block-latest-posts.is-grid.articoliNews > li:hover {
    cursor: pointer;
    background-color: #dbdbdb;
    border: 5px solid grey;
    transition: border 0.3s ease;
    transition: background-color 0.3s ease;
}

.articoliNews{
    justify-content: center;
    gap: 30px;
    
}

.wp-block-latest-posts__post-title a {
    font-weight: bold; /* Imposta il testo in grassetto */
    text-transform: uppercase; /* Imposta il testo in maiuscolo */
    text-decoration: none; /* Rimuove la sottolineatura */
    color: inherit; /* Mantiene il colore del testo originale */
    pointer-events: none; /* Disabilita il clic sul link */
    cursor: default; /* Cambia il cursore in quello di default, non da link */
}

.wp-block-latest-posts__post-title {
    font-weight: bold; /* Imposta il testo in grassetto */
    text-transform: uppercase; /* Imposta il testo in maiuscolo */
    text-decoration: none; /* Rimuove la sottolineatura */
    pointer-events: none; /* Disabilita il clic sul link */
    cursor: default; /* Cambia il cursore in quello di default, non da link */
}


.wp-block-latest-posts__post-excerpt {
    display: flex;
    flex-direction: column;
}

.wp-block-latest-posts__post-excerpt::before {
    content: attr(data-title); /* Inserisce il titolo prima del contenuto */
    font-weight: bold;
    margin-bottom: 5px;
}


/* Nuova regola per il link "Leggi tutto" */
.wp-block-latest-posts.is-grid.articoliNews > li:hover a.wp-block-latest-posts__read-more {
    color: #ffa500; /* Colore arancione */
    transition: color 0.3s ease; /* Aggiungi una transizione fluida */
}




/* FORM CONTATTI */

.form-contatti {
    max-width: 600px;
    margin: 0 auto;
}

.form-contatti p {
    margin-bottom: 20px;
}

.form-contatti .flex-container {
    display: flex;
    gap: 20px; /* Spazio tra i campi Nome e Cognome */
}

.form-contatti .input,
.form-contatti .textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
    box-sizing: border-box; /* Assicura che il padding non superi la larghezza */
    background-color: #f9f9f9;
    transition: border-color 0.3s ease-in-out;
}

.form-contatti .input:focus,
.form-contatti .textarea:focus {
    border-color: #0073aa; /* Cambia colore del bordo quando il campo è in focus */
    outline: none;
}

/* Assicurati che l'area del messaggio abbia la stessa grafica */
.form-contatti .textarea {
    resize: vertical; /* Permette di ridimensionare solo in verticale */
}

/* Per schermi piccoli, rendiamo i campi uno sotto l'altro */
@media (max-width: 600px) {
    .form-contatti .flex-container {
        flex-direction: column;
    }
}


#success-overlay{
    max-width: 100%;
    margin-block-start: 0%;
}
/* barra desktop*/
body > div.wp-site-blocks > div > header > div > nav.items-justified-center.no-wrap.wp-block-navigation.is-content-justification-center.is-nowrap.is-layout-flex.wp-container-core-navigation-is-layout-2.wp-block-navigation-is-layout-flex.cc-hide-on-mobile.cc-hide-on-tablet > ul {
    color: #808080;
}

/* esci*/
body > div.wp-site-blocks > div > header > div > div.logged-in.wp-block-loginout > a {
    color: #808080;
}
/* bottone tre linee*/
body > div.wp-site-blocks > div > header > div > nav.is-responsive.items-justified-center.no-wrap.wp-block-navigation.is-content-justification-center.is-nowrap.is-layout-flex.wp-container-core-navigation-is-layout-1.wp-block-navigation-is-layout-flex.cc-hide-on-desktop > button{
    color: #808080;
}

#modal-2-content{
    color: #808080;
}

/* SITO INGLESE */
/* barra desktop*/
body > div.wp-site-blocks > div > header > div > nav.items-justified-center.wp-block-navigation.is-content-justification-center.is-layout-flex.wp-container-core-navigation-is-layout-2.wp-block-navigation-is-layout-flex.cc-hide-on-mobile.cc-hide-on-tablet > ul{
    color: #808080;
}
/* bottone tre linee*/
body > div.wp-site-blocks > div > header > div > nav.is-responsive.items-justified-center.wp-block-navigation.is-content-justification-center.is-layout-flex.wp-container-core-navigation-is-layout-1.wp-block-navigation-is-layout-flex.cc-hide-on-desktop > button{
    color: #808080;
}
/* barra mobile*/
#modal-1-content{
    color: #808080;
}
a:where(:not(.wp-element-button)){
    color: #808080;
}

body > div.wp-site-blocks > div.wp-block-group.alignwide.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained > div > div{
    color: #808080;
}

body > div.wp-site-blocks > div.wp-block-group.alignwide.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained > div > div > div > div{
    font-size: 12px;
}