/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/



/* FORM XENION - PERSONALIZZAZIONE */

#box-pren-xenion {
    background-color: var(--background-1-light) !important; 
    padding: 40px !important;
    border-radius: 2px !important; 
    position: relative !important;
		overflow: visible !important;
}

/* Altezza e allineamento uniforme */
#box-pren-xenion .input-text,
#box-pren-xenion .input-select,
#box-pren-xenion .btn-search {
    height: 48px;
    line-height: 48px;
    box-sizing: border-box;
    margin: 0;
    vertical-align: middle;
}

/* Pulsante "Cerca" */
#box-pren-xenion .btn-search {
    background-color: var(--background-1-dark) !important;
    color: #ffffff !important;
    font-family: 'Lora', serif !important;
    font-weight: 600;
    font-style: italic !important;
    text-transform: uppercase;
    font-size: 14px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 28px !important; /* niente padding top/bottom, solo orizzontale */
    border: 1px solid #C8DEE3;
    line-height: 1 !important;
}

/* Input text (Check-in, Check-out) */
#box-pren-xenion .input-text {
    padding: 0 16px;
    font-family: 'Lora', serif !important;
    font-weight: 600;
    border: 1px solid #C8DEE3;
}

/* Select (Adulti, Bambini) */
#box-pren-xenion .input-select {
    padding: 0 16px;
    font-family: 'Lora', serif !important;
    font-weight: 600;
    font-size: 13px !important;
    border: 1px solid #C8DEE3;
}

/* Rimozione elementi non necessari */
#box-pren-xenion .powered-by,
#box-pren-xenion .link-xenion,
#box-pren-xenion .title {
    display: none !important;
}

/* Larghezza minima */
#box-pren-xenion input,
#box-pren-xenion select {
    min-width: 120px;
}


/* NAVIGAZIONE - EFFETTO HOVER LIFT */

@media (min-width: 769px) {
  .main-navigation .main-nav ul li > a {
    transition: all 300ms ease-in-out;
  }
}

.main-navigation .main-nav ul li:hover > a {
  transform: translate3d(0, -3px, 0);
}


/* CODICE CSS DI MIKE PER MODIFICARE FORM DI FLUENT FORMS */

/* fluent forms field style */
.fluentform .frm-fluent-form .ff-el-form-control {
  background-color: #FAF1EB;
  color: #000;
  border-bottom: 1px solid #FAF9EB;
  border-radius: 0px;
  font-size: 16px;
  line-height: 1.7em;
  padding: 14px 24px;
}

/* fluent forms focus field style */
.fluentform .frm-fluent-form .ff-el-form-control:focus {
  border: 2px solid #999;
  outline: none;
}

/* control space below fields */
.fluentform .frm-fluent-form .ff-el-group {
  margin-bottom: 15px;
}

/* fluent forms placeholder text style */
.fluentform .frm-fluent-form .ff-el-form-control::placeholder {
  color: #5C5C5C;
  font-size: 16px;
}

/* placeholder focus text style */
.fluentform .frm-fluent-form .ff-el-form-control:focus::placeholder {
  color: #1A282B;
}

/* Pulsante style */
.fluentform .frm-fluent-form .ff-btn-submit {
    background-color: #6E5647;
    transition: background-color 0.3s ease;
    color: #ffffff;
    letter-spacing: 0.1em;
    padding: 8px 24px;
	  border-radius: 2px;
}

/* Pulsante su hover */
.fluentform .frm-fluent-form .ff-btn-submit:hover {
    background-color: #ffffff;
	  color: #6E5647;
	  border: solid 1px
}


/* mobile full width button */
@media (max-width: 768px) {
  .fluentform .frm-fluent-form .ff-btn-submit {
    width: 100%;
  }
}

/* form error text style */
.fluentform .ff-el-is-error .text-danger {
  font-size: 14px !important;
  color: #999;
}

/* success message style */
.fluentform .ff-message-success {
  position: relative;
  border: none;
  box-shadow: none;
  font-size: 15px;
  font-weight: 600;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0px;
  margin-top: 20px;
}


/* gdpr text style */
.fluentform .ff-el-tc label.ff_tc_label {
    color: #1A282B; 
    font-size: 16px; 
}

/* Aggiunge sottolineatura e grassetto ai link mantenendo il colore originale */
.fluentform .ff-el-tc label.ff_tc_label a {
    text-decoration: underline;
    font-weight: bold; 
    color: inherit; /* Mantiene il colore del testo circostante */
}

/* Effetto visivo per hover e focus */
.fluentform .ff-el-tc label.ff_tc_label a:hover, 
.fluentform .ff-el-tc label.ff_tc_label a:focus {
    text-decoration: underline;
    font-weight: bold;
    background-color: rgba(26, 40, 43, 0.1); /* Leggero sfondo per evidenziare */
    outline: none;
}


/* PER AVERE UNA BAR BOTTOM SUL MOBILE Kyle */

.mobile-bar {
  position: fixed;
  width: 100%;
  bottom: 0;
  z-index: 999;
}


/* SITE WRAPPER - KYLE (combo  con snippet) 
.site-wrapper {
    width: 100%;
    max-width: 1920px;
    margin-inline: auto;
}
*/


/* Animazione freccia in loop per scroll (pagine principali) */
.arrow-down {
  animation: bounce-arrow 4s infinite ease-in-out;
}

@keyframes bounce-arrow {
  0%   { transform: translateY(0); opacity: 1; }
  50%  { transform: translateY(10px); opacity: 0.6; }
  100% { transform: translateY(0); opacity: 1; }
}


/* Per lo scroll infinito nella pagina dei servizi */
.infinite-scroll {
  overflow: hidden;
  user-select: none;
  display: flex;
  white-space: nowrap;
  position: relative;
}

.infinite-scroll > div {
  display: flex;
  flex-wrap: nowrap;
  animation: scroll 20s linear infinite;
}

.infinite-scroll:hover > div {
  animation-play-state: paused;
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.infinite-scroll .gb-container {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}


/* Immagini di background cross fade - qui fatto in homepage */

@media (min-width: 1024px) {
	.bg-fade-wrapper {
		position: relative;
		overflow: hidden;
	}

	.bg-fade{
		position: absolute; 
		width: 100%;
		height: 100%; 
		inset: 0;
		background-size: cover; 
		background-position: center center;
		opacity: 0;
		animation-name: fade-zoom;
		animation-duration: 18s;
		animation-iteration-count: infinite;
	}

	.bg-fade:nth-child(2){
		animation-delay: 0s;
	}

	.bg-fade:nth-child(3){
		animation-delay: 6s;
	}

	.bg-fade:nth-child(4){
		animation-delay: 12s;
	}
}

@keyframes fade-zoom {
	0% {
		opacity:0;
		transform: scale(100%);
	}
	16.66% {
		opacity:1
	}
	33.33% {
		opacity:1
	}
	48.66% {
		opacity:0
	}
	100% {
		opacity:0; 
		transform: scale(110%);
	}
}




/* Per avere un effetto più soft e di transizione tra una pagina e l'altra (visto con T. Fog) */
@media (prefers-reduced-motion: no-preference) {
  @view-transition {
    navigation: auto;
  }
}


/* PER RENDERE UN TESTO BILANCIATO E NON LASCIARE PAROLE DA SOLE A CAPO 
*/

.balance {
  text-wrap: balance;
}

p, li {
  text-wrap: pretty;
}


/* per cambiare il colore di selezione del testo */

::selection {
  background: #DFECF5; /* colore viola brillante */
  color: #3B3526;
}


/* Reveal text animation nell'h1 della homepage */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.text-reveal {
  opacity: 0; /* invisibile inizialmente */
  animation: fadeIn ease-in 1;
  animation-fill-mode: forwards;
  animation-duration: 1.4s;
}

.text-reveal.delayed {
  animation-delay: 1.4s;
}



/* down scale effect su pagine dove ho foto o immagini*/
.image-scale-animate {
  transform: scale(1.05);
  transition: transform 3.5s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.image-scale-animate.in-view {
  transform: scale(1);
}


/* Effetto marquee - infinite scroll - top bar per annunci*/

.carousel-container:hover .carousel-track {
    animation-play-state: paused;
}

.carousel-track {
    animation: scroll 165s linear infinite;
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}


/* Effetto marquee - infinite scroll per il popup che si attiva su inattività dell'utente*/

.carousel-container:hover .carousel-track {
    animation-play-state: paused;
}

.carousel-track {
    animation: scroll 165s linear infinite;
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}



/*
 * .sr-only = "Screen Reader Only"
 *
 * Nasconde visivamente un elemento senza rimuoverlo dal DOM
 * e senza escluderlo, normalmente, dall'accessibility tree.
 *
 * È utile per contenuti semanticamente importanti che devono
 * restare disponibili agli screen reader, ad esempio:
 * heading, label, testi descrittivi o istruzioni accessibili.
 *
 * A differenza di display: none; o visibility: hidden;,
 * il contenuto resta generalmente leggibile dalle tecnologie assistive.
 *
 * Nota SEO:
 * il contenuto resta presente nell'HTML, ma questa tecnica
 * dovrebbe essere utilizzata per esigenze reali di accessibilità/UX,
 * non per inserire keyword o testo nascosto esclusivamente ai fini SEO.
 */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}