/* ========= Booking Expert – Premium Blue / Green ========= */
/* Wrapper */
#bookingexpert{
  max-width: 1100px;
  margin: 0 auto;
  padding: 28px;
  border-radius: 18px;

  background: #ffffff;
  border: 1px solid rgba(0,0,0,.06);

  box-shadow:
    0 12px 30px rgba(0,0,0,.08),
    0 2px 10px rgba(0,0,0,.04);

  position: relative;
  overflow: hidden;
  font-family: inherit;
}

/* ===== STRISCIA SUPERIORE BLU → VERDE ===== */
#bookingexpert::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:6px;
  background: linear-gradient(
    90deg,
    #1e40af,   /* blu */
    #2563eb,   /* blu acceso */
    #16a34a    /* verde */
  );
}

/* Box interno */
#bookingexpert #acrbox{
  width:100%;
}

/* Tipografia */
#bookingexpert,
#bookingexpert *{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Labels */
#bookingexpert label{
  font-weight: 600;
  font-size: .95rem;
  color: rgba(0,0,0,.75);
  margin-bottom: .35rem;
}

/* Inputs (esclusi checkbox/radio) */
#bookingexpert input:not([type="checkbox"]):not([type="radio"]),
#bookingexpert select,
#bookingexpert textarea{
  width: 100%;
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  background: #fff;
  padding: 0.75rem 0.95rem !important;
  font-size: 1rem;

  transition: all .2s ease;
}

/* Focus blu/verde */
#bookingexpert input:not([type="checkbox"]):not([type="radio"]):focus,
#bookingexpert select:focus,
#bookingexpert textarea:focus{
  outline: none;
  border-color: #16a34a !important;
  box-shadow: 0 0 0 4px rgba(22,163,74,.18);
}

/* Placeholder */
#bookingexpert input::placeholder,
#bookingexpert textarea::placeholder{
  color: rgba(0,0,0,.35);
}

/* Spaziatura */
#bookingexpert .row,
#bookingexpert .form-group,
#bookingexpert .form-row,
#bookingexpert .field{
  margin-bottom: 14px;
}

/* ===== BOTTONI BLU / VERDE ===== */
#bookingexpert button,
#bookingexpert input[type="submit"],
#bookingexpert .btn,
#bookingexpert input[type="button"]{
  border: none !important;
  border-radius: 14px !important;
  padding: 0.9rem 1.4rem !important;

  font-weight: 700;
  letter-spacing: .2px;
  cursor: pointer;
  color: #fff !important;

  background: linear-gradient(
    135deg,
    #2563eb,
    #16a34a
  ) !important;

  box-shadow: 0 10px 18px rgba(22,163,74,.25);
  transition: all .2s ease;
}

#bookingexpert button:hover,
#bookingexpert input[type="submit"]:hover,
#bookingexpert .btn:hover,
#bookingexpert input[type="button"]:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 30px rgba(22,163,74,.35);
}

#bookingexpert button:active,
#bookingexpert input[type="submit"]:active,
#bookingexpert .btn:active,
#bookingexpert input[type="button"]:active{
  transform: translateY(0);
}

/* Link */
#bookingexpert a{
  color: #2563eb;
  text-decoration: none;
}
#bookingexpert a:hover{
  text-decoration: underline;
}

/* Messaggi errore */
#bookingexpert .error,
#bookingexpert .alert,
#bookingexpert .notice{
  border-radius: 12px;
  padding: 12px 14px;
  background: rgba(220,38,38,.08);
  border: 1px solid rgba(220,38,38,.25);
}

/* Mobile */
@media (max-width: 768px){
  #bookingexpert{
    padding: 18px;
    border-radius: 14px;
  }
}

/* =======================================================
   FIX checkbox privacy – checkbox affianco al testo
   ======================================================= */

#bookingexpert input[type="checkbox"],
#bookingexpert input[type="radio"]{
  width: auto !important;
  margin: 0 .55rem 0 0 !important;
  padding: 0 !important;
  vertical-align: middle;
}

/* checkbox + label */
#bookingexpert input[type="checkbox"] + label,
#bookingexpert input[type="radio"] + label{
  display: inline-flex !important;
  align-items: center;
  gap: .55rem;
  line-height: 1.4;
  cursor: pointer;
  margin: 0 !important;
}

/* input dentro label */
#bookingexpert label:has(input[type="checkbox"]),
#bookingexpert label:has(input[type="radio"]){
  display: inline-flex !important;
  align-items: center;
  gap: .55rem;
  margin: 0 !important;
}

/* fallback */
#bookingexpert .privacy,
#bookingexpert .checkbox,
#bookingexpert .form-check{
  display: flex !important;
  align-items: center;
  gap: .55rem;
}

/* =======================================================
   FIX FORM GENERATO: div del form in colonna (default)
   ======================================================= */
#bookingexpert #acrbox form > div{
  display: block;
  margin-bottom: 14px;
}

/* =======================================================
   ✅ FIX REALE: 4 SELECT GUESTTYPES (Adulti/Bambini) IN RIGA
   - Nel tuo HTML sono 4 <div> consecutivi con select name="guesttypes..."
   - BookingExpert usa "nice-select", quindi gestiamo anche quello
   ======================================================= */

/* 1) Trasformo il PRIMO div (Adulti) in grid container */
#bookingexpert #acrbox form > div:has(select[name^="guesttypes"]){
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

/* 2) I 4 div (Adulti + 3 Bambini) diventano "celle" della grid */
#bookingexpert #acrbox form > div:has(select[name^="guesttypes"]) > div:has(select[name^="guesttypes"]){
  margin: 0 !important;
}

/* 3) Dentro ogni cella: label sopra, select/nice-select a tutta larghezza */
#bookingexpert #acrbox form > div:has(select[name^="guesttypes"]) > div:has(select[name^="guesttypes"]) label{
  display: block;
  margin-bottom: .35rem;
  white-space: nowrap;
}

#bookingexpert #acrbox form > div:has(select[name^="guesttypes"]) > div:has(select[name^="guesttypes"]) select{
  width: 100% !important;
}

/* BookingExpert: dropdown “nice-select” */
#bookingexpert #acrbox form > div:has(select[name^="guesttypes"]) > div:has(select[name^="guesttypes"]) .nice-select{
  width: 100% !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  padding: 0.75rem 0.95rem !important;
  height: auto !important;
  line-height: normal !important;
}

/* =======================================================
   RESPONSIVE: 4->2->1
   ======================================================= */
@media (max-width: 768px){
  #bookingexpert #acrbox form > div:has(select[name^="guesttypes"]){
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px){
  #bookingexpert #acrbox form > div:has(select[name^="guesttypes"]){
    grid-template-columns: 1fr;
  }
}