/* 1. Spacing utilities */

.pt30 {

  padding-top: 30px;

}



.pb30 {

  padding-bottom: 30px;

}



.pt40 {

  padding-top: 40px;

}



.pb40 {

  padding-bottom: 40px;

}



.pt60 {

  padding-top: 60px;

}



.pb60 {

  padding-bottom: 60px;

}



.pt70 {

  padding-top: 70px;

}



.pb70 {

  padding-bottom: 70px;

}



.pt130 {

  padding-top: 130px;

}



.pb130 {

  padding-bottom: 130px;

}



.pt150 {

  padding-top: 150px;

}



.pb150 {

  padding-bottom: 150px;

}



.pt180 {

  padding-top: 180px;

}



.pb180 {

  padding-bottom: 180px;

}



.pt200 {

  padding-top: 200px;

}



.pb200 {

  padding-bottom: 200px;

}



.mt10 {

  margin-top: 10px;

}



.mb10 {

  margin-bottom: 10px;

}



.mt20 {

  margin-top: 20px;

}



.mb20 {

  margin-bottom: 20px;

}



/* 2. Layout & container width overrides */

.container,

.container-lg,

.container-md,

.container-sm,

.container-xl {

  max-width: 1170px;

}



/* 3. Header wrapper & navigation base */

/* 1) Togli il background dal wrapper globale */

.ugf-wraper {

  background: none;            

  background-attachment: scroll !important;

}



.ugf-nav-wrap {

  padding: 20px 0;

  -webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.03);

  box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.03);

  position: static !important;

  top: auto !important;

  left: auto !important;

  right: auto !important;

}



.ugf-nav,

.ugf-nav-wrap,

.ugf-nav .logo-wrap,

.ugf-nav .job-wrap {

  transition: none !important;

  -webkit-transition: none !important;

  -o-transition: none !important;

}



/* Facoltativo: se qualche JS aggiunge la classe .fixed allo scroll, neutralizzala */

.ugf-nav-wrap.fixed {

  position: static !important;

}



.ugf-nav .logo-wrap {

  position: absolute;

  top: 5px;

  left: 0;

  -webkit-transition: all .3s ease;

  -o-transition: all .3s ease;

  transition: all .3s ease;

}



.ugf-nav .logo-wrap .logo,

.ugf-nav .logo-wrap .logo-half {

  position: absolute;

  top: 0;

  left: 0;

  -webkit-transition: all .3s ease;

  -o-transition: all .3s ease;

  transition: all .3s ease;

}



.ugf-nav .job-wrap {

  padding-top: 10px;

  padding-left: 0;

  -webkit-transition: all .3s ease;

  -o-transition: all .3s ease;

  transition: all .3s ease;

}



.ugf-nav .job-wrap h3 {

  font-size: 1.8rem;

  color: #1c2437 !important;

  font-family: "Roboto", sans-serif;

  font-weight: 700;

  padding-bottom: 10px;

}



.ugf-nav .job-wrap ul {

  padding: 0;

  margin: 0;

  list-style: none;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

}



.ugf-nav .job-wrap ul li {

  margin-right: 20px;

  font-size: 1.4rem;

  color: #546274;

}



.ugf-nav .job-wrap ul li:last-child {

  margin-right: 0;

}



.ugf-nav .job-wrap ul li img {

  margin-right: 10px;

}



.ugf-nav-wrap.fixed .ugf-nav {

  padding: 0;

  padding-left: 60px;

}



.ugf-nav-wrap.fixed .ugf-nav .logo-wrap {

  top: 0;

}



.ugf-nav-wrap.fixed .ugf-nav .logo-wrap .logo {

  visibility: hidden;

  opacity: 0;

}



.ugf-nav-wrap.fixed .ugf-nav .job-wrap {

  padding-top: 0;

}



.ugf-nav-wrap.fixed .ugf-nav .job-wrap h3 {

  padding-bottom: 0;

}



/* 4. Job application wrapper spacing */

.ufg-job-application-wrapper {

  padding: 60px 0 50px; /* prima era 230px */

}



@media all and (max-width: 991px) {

  .ufg-job-application-wrapper { padding-top: 80px !important; } /* era 260px */

  .ugf-wraper { background-attachment: scroll !important; }      /* evita jank */

}



/* 5. Form blocks & form-group structure */

.ufg-job-application-wrapper .job-application-form .input-type-block + .input-type-block {

  margin-top: 50px;

}



.ufg-job-application-wrapper .job-application-form .input-type-block.check-field .form-group,

.ufg-job-application-wrapper .job-application-form .input-type-block.radio-field .form-group {

  margin-bottom: 15px;

}



.ufg-job-application-wrapper .job-application-form .input-type-block.check-field .form-group:last-child,

.ufg-job-application-wrapper .job-application-form .input-type-block.radio-field .form-group:last-child {

  margin-bottom: 0;

}



.ufg-job-application-wrapper .job-application-form h4 {

  font-size: 1.8rem;

  font-weight: 700;

  color: #ffffff;

  font-family: "Roboto", sans-serif;

  margin-bottom: 20px;

}



.ufg-job-application-wrapper .job-application-form h4 span {

  font-weight: 400;

  color: #546274;

}



.ufg-job-application-wrapper .job-application-form h4 .required {

  color: #ff3e58;

}



.ufg-job-application-wrapper .job-application-form .form-group {

  margin-bottom: 25px;

}



/* Sezione "Sesso" / check-gender */

.ufg-job-application-wrapper .job-application-form .form-group.check-gender {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  position: relative;

  padding-top: 25px;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .lebel-text {

  position: absolute;

  top: -5px;

  left: 0;

  font-size: 1.2rem;

  font-weight: 700;

  color: #1c2437;

  font-family: "Roboto", sans-serif;

  text-transform: uppercase;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .lebel-text span {

  color: #ff3e58;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio {

  -webkit-box-flex: 0;

  -ms-flex: 0 0 135px;

  flex: 0 0 135px;

  height: 60px;

  margin-right: 20px;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-input {

  display: none;

  outline: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  -moz-appearance: none;

  -webkit-appearance: none;

  appearance: none;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-input:checked ~ .custom-control-label {

  border-color: #1e85ff;

  color: #1e85ff;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-input:checked ~ .custom-control-label::before {

  background: #1e85ff;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-input:checked ~ .custom-control-label::after {

  background-image: none;

  content: url(../images/check-white.svg);

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-label {

  cursor: pointer;

  background: #ffffff;

  height: 60px;

  border: 1px solid rgba(0, 0, 0, 0.12);

  border-radius: 5px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  font-size: 1.5rem;

  font-weight: 400;

  font-family: "Roboto", sans-serif;

  color: #b2becc;

  padding-left: 58px;

  text-transform: capitalize;

  position: relative;

  top: 0;

  left: 0;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-label:before {

  height: 18px;

  width: 18px;

  border-radius: 5px;

  background: #e1e7ee;

  border: none;

  top: 19px;

  left: 20px;

}



.ufg-job-application-wrapper .job-application-form .form-group.check-gender .custom-radio .custom-control-label:after {

  height: 18px;

  width: 18px;

  top: 20px;

  left: 20px;

  border-radius: 5px;

}



/* Label e testo form */

.ufg-job-application-wrapper .job-application-form .form-group .input-label {

  font-size: 1.2rem;

  font-weight: 700;

  color: #ffffff !important;      /* etichette bianche */

  font-family: "Roboto", sans-serif;

  text-transform: uppercase;

}



/* Asterisco obbligatorio */

.ufg-job-application-wrapper .job-application-form .form-group .input-label span {

  color: #ce181d !important;      /* rosso ECM */

  font-weight: 700;

  margin-right: 3px;

}



.ufg-job-application-wrapper .job-application-form .form-group .input-label .text {

  font-size: 1.2rem;

  color: #546274;

  font-weight: 400;

}



/* Input base */

.ufg-job-application-wrapper .job-application-form .form-group .form-control {

  height: 60px;

  background: #ffffff;

  border: 1px solid rgba(0, 0, 0, 0.12);

  border-radius: 5px;

  padding: 0 25px;

  color: #1c2437;                 /* testo scuro sul bianco */

  font-family: "Roboto", sans-serif;

  font-weight: 400;

  outline: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  font-size: 1.4rem;

}



/* Placeholder (uniformato e leggibile) */

.ufg-job-application-wrapper .job-application-form .form-group .form-control::-webkit-input-placeholder {

  /* Chrome/Opera/Safari */

  color: #9fb7c9 !important;

  opacity: 1;

}



.ufg-job-application-wrapper .job-application-form .form-group .form-control::-moz-placeholder {

  /* Firefox 19+ */

  color: #9fb7c9 !important;

  opacity: 1;

}



.ufg-job-application-wrapper .job-application-form .form-group .form-control:-ms-input-placeholder {

  /* IE 10+ */

  color: #9fb7c9 !important;

}



.ufg-job-application-wrapper .job-application-form .form-group .form-control:-moz-placeholder {

  /* Firefox 18- */

  color: #9fb7c9 !important;

}



.ufg-job-application-wrapper .job-application-form .form-group textarea.form-control {

  height: 110px;

  padding-top: 15px;

}



/* Checkbox personalizzate */

.ufg-job-application-wrapper .job-application-form .form-group .custom-checkbox .custom-control-input {

  height: 18px;

  width: 18px;

  border-radius: 3px;

  border: 1px solid rgba(0, 0, 0, 0.12);

  outline: none;

  -webkit-box-shadow: none;

  box-shadow: none;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {

  background: #1888f5;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-checkbox .custom-control-label {

  width: auto;

  text-align: left;

  position: static;

  top: auto;

  left: auto;

  -webkit-transform: translateY(0);

  -ms-transform: translateY(0);

  transform: translateY(0);

  padding-left: 30px;

  cursor: default;

  text-transform: capitalize;

  font-size: 1.5rem;

  font-weight: 400;

  color: #546274;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-checkbox .custom-control-label:before {

  top: 4px;

  left: 0;

  height: 18px;

  width: 18px;

  border-radius: 3px;

  border: 1px solid rgba(0, 0, 0, 0.12);

  -webkit-box-shadow: none;

  box-shadow: none;

  outline: none;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-checkbox .custom-control-label:after {

  top: 4px;

  left: 0;

  height: 18px;

  width: 18px;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-checkbox .custom-control-label a {

  color: #1e85ff;

}



/* Radio standard (non blocco "Sesso") */

.ufg-job-application-wrapper .job-application-form .form-group .custom-radio .custom-control-input {

  display: none;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-radio .custom-control-input:checked ~ .custom-control-label::before {

  border-width: 2px;

  border-color: #1e85ff;

  background: #ffffff;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-radio .custom-control-input:checked ~ .custom-control-label::after {

  opacity: 1;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-radio .custom-control-label {

  width: auto;

  text-align: left;

  position: static;

  top: auto;

  left: auto;

  -webkit-transform: translateY(0);

  -ms-transform: translateY(0);

  transform: translateY(0);

  padding-left: 30px;

  cursor: default;

  text-transform: capitalize;

  font-size: 1.5rem;

  font-weight: 400;

  color: #546274;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-radio .custom-control-label:before {

  top: 2px;

  left: 0;

  height: 20px;

  width: 20px;

  border-radius: 50%;

  border: 1px solid rgba(0, 0, 0, 0.12);

  -webkit-box-shadow: none;

  box-shadow: none;

  outline: none;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-radio .custom-control-label:after {

  top: 7px;

  left: 5px;

  height: 10px;

  width: 10px;

  border-radius: 50%;

  background: #1e85ff;

  opacity: 0;

  content: '';

  -webkit-transition: all .3s ease;

  -o-transition: all .3s ease;

  transition: all .3s ease;

}



/* File upload */

.ufg-job-application-wrapper .job-application-form .form-group .custom-file {

  height: auto;

  height: 80px;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-file .form-control {

  outline: none;

  display: none;

  -webkit-box-shadow: none;

  box-shadow: none;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-file .form-control:focus {

  outline: none;

  -webkit-box-shadow: none;

  box-shadow: none;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-file .custom-file-label {

  top: 28px;

  overflow: hidden;

  margin-bottom: 0;

  height: 60px;

  border-radius: 5px;

  padding: 0;

  color: #b2becc;

  border: 1px dashed #bfbfbf;

  padding-left: 140px;

  line-height: 60px;

}



.ufg-job-application-wrapper .job-application-form .form-group .custom-file .custom-file-label:after {

  content: '+ CHOOSE FILE';

  top: 16px;

  left: 25px;

  right: auto;

  font-size: 1.2rem;

  color: #546274;

  background: #eceff2;

  border-radius: 5px;

  border: 0;

}



/* Bottone default template (sovrascritto sotto per tema ECM) */

.ufg-job-application-wrapper .job-application-form .btn {

  height: 60px;

  width: 100%;

  border-radius: 30px;

  background: #1e85ff;

  color: #ffffff;

  outline: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  font-size: 1.5rem;

  font-weight: 700;

  font-family: "Roboto", sans-serif;

}



/* 6. Submission confirmation page layout */

.final-content {

  display: -webkit-box; 

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -ms-flex-direction: column;

  flex-direction: column;

  min-height: 100vh;

  padding: 120px 0;

  text-align: center;

}



.final-content .icon {

  margin-bottom: 20px;

}



.final-content h2 {

  font-size: 3.6rem;

  font-weight: 700;

  color: #1c2437;

  font-family: "Roboto", sans-serif;

  margin-bottom: 10px;

}



.final-content p {

  font-size: 1.5rem; 

  font-weight: 400; 

  color: #546274;

  font-family: "Roboto", sans-serif; 

}



/* 7. Validation & error message positioning */

.form-group{

  position: relative;

}



.input-group span.error{

  top: 20px !important;

}



.select-input span.error{

  top: 20px !important;

  right: 33px !important;

}



span.error#experiance-error{

  top: 0px !important;

}



span.error#checkbox-error{

  top: 3px !important;

}



span.error{

  color: #ff0000 !important; 

  position: absolute; 

  right: 20px !important; 

  top: 45px !important; 

  left: auto !important;

  text-transform: none !important; 

  min-width: max-content; 

}



input.error{

  border-color: rgba(255, 0, 0, 0.50) !important;

}



input.error:focus{

  background: transparent !important;

  border: 1px solid rgba(255, 0, 0, 0.50) !important; 

}



/* Neutralizza stile errore per uniformare a Nome */

input.error,

input.error:focus { 

  border: 1px solid rgba(0,0,0,0.12) !important; 

  background: #fff !important; 

}



/* 8. Browser-specific tweaks – Chrome autofill */

/* Neutralizza tinta gialla dell’autofill Chrome */

input:-webkit-autofill, 

input:-webkit-autofill:focus { 

  box-shadow: inset 0 0 0 1000px #fff !important; 

  -webkit-text-fill-color: #546274; 

  transition: background-color 9999s ease-in-out 0s; 

}



/* 9. Theming overrides – header gradient & background */

.ugf-nav-wrap {

  background: #fff !important; 

  box-shadow: none !important; 

  position: relative; 

  z-index: 2; 

}



.ugf-wraper {

  background:

    linear-gradient(to bottom, #ffffff 0, rgba(255,255,255,0) 100px) no-repeat,

    #6D9EAE !important; 

  background-size: 100% 100px, auto; 

  background-attachment: scroll, scroll !important; /* evita jank su mobile */

}



.ufg-job-application-wrapper {

  background: transparent !important; /* rimuove eventuale background color */

}



/* Adatta il gradiente su tablet/smartphone */

@media (max-width: 991px) {

  .ugf-wraper {

    background:

      linear-gradient(to bottom, #ffffff 0, rgba(255,255,255,0) 80px) no-repeat, 

      #6D9EAE !important; 

    background-size: 100% 80px, auto; 

  }

  .ufg-job-application-wrapper { padding-top: 80px !important; }

}



/* Testo radio più leggibile */

.form-group input[type="radio"] + label,

.form-group label input[type="radio"] + span,

.form-group label {

  color: #ffffff !important;

  font-weight: 500;

}



/* Distanza uniforme tra radio/label */

.form-group label {

  display: inline-flex; 

  align-items: center;  

  gap: 6px;

}



/* Invia candidatura – variante ECM (sfondo bianco, testo blu) */

.ufg-job-application-wrapper .job-application-form .btn {

  background-color: #6D9EAE !important;

  color: #ffffff !important;

  border: 2px solid #ffffff !important;

  font-weight: 700;

  transition: all 0.3s ease;

}



/* Hover */

.ufg-job-application-wrapper .job-application-form .btn:hover {

  background-color: #6D9EAE !important;

  color: #ffffff !important;

}



/* Click (active) */

.ufg-job-application-wrapper .job-application-form .btn:active {

  background-color: #0b5ed7 !important;

  color: #ffffff !important;

}



/* Logo su smartphone adattato */

@media (max-width: 575px) {

  .ugf-nav .job-wrap img {

    height: 35px !important;

    max-width: 100%;

  }

}



/* Forza testo privacy in bianco */

.checkbox-custom label {

  color: #ffffff !important;

}

