.fattoria-event-form{
  --f-green:#2a9d8f;
  --f-yellow:#ffd000;
  --f-pink:#ff3366;
  --f-blue:#33bfff;
  --f-cream:#fffdf9;
  --f-ink:#000000;
  --f-error:#a52620;

  box-sizing:border-box;
  width:100%;
  max-width:1100px;
  margin:2rem auto;
  padding:60px 20px;

  background:var(--f-green);
  color:var(--f-ink);

  border:5px solid var(--f-ink);
  border-radius:24px;
  box-shadow:10px 10px 0 var(--f-ink);

  font-family:'Fredoka',system-ui,-apple-system,sans-serif;
  font-size:1rem;
  line-height:1.6;
}

.fattoria-event-form *,
.fattoria-event-form *::before,
.fattoria-event-form *::after{
  box-sizing:border-box;
}

.fattoria-event-form [hidden]{
  display:none!important;
}

/* TITOLO PRINCIPALE */
.fattoria-event-form h2{
  width:100%;
  margin:0 auto 35px!important;

  color:#fff!important;
  text-align:center!important;
  text-transform:uppercase;

  font-family:'Oswald','Impact',sans-serif!important;
  font-size:clamp(2.2rem,6vw,3.8rem)!important;
  line-height:1.1!important;
  letter-spacing:-1px;

  text-shadow:
    3px 3px 0 #000,
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000;
}

/* INDICATORE STEP */
.fattoria-event-form-progress{
  width:max-content;
  max-width:100%;
  margin:0 auto 30px;
  padding:7px 14px;

  background:var(--f-yellow);
  color:#000;

  border:3px solid #000;
  border-radius:8px;
  box-shadow:3px 3px 0 #000;

  font-family:'Oswald',sans-serif;
  font-weight:700;
  text-transform:uppercase;
}

/* STEP / LAVAGNA */
.fattoria-event-form .fattoria-event-step{
  width:100%;
  margin:0;
  padding:35px;
  min-width:0;

  background:var(--f-cream);

  border:4px solid #000;
  border-radius:24px;
  box-shadow:8px 8px 0 #000;
}

/* LEGEND */
.fattoria-event-step legend{
  width:100%;
  margin:0 0 25px;
  padding:0;

  color:#000;

  font-family:'Oswald',sans-serif;
  font-size:1.8rem;
  font-weight:500;
  line-height:1.2;
  text-transform:uppercase;
}

/* GRIGLIE */
.fattoria-event-form-options,
.fattoria-event-form-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:18px;
  margin-bottom:1.25rem;
}

.fattoria-event-form label{
  display:block;
  font-weight:700;
}

/* SCELTE EVENTO */
.fattoria-event-form .fattoria-event-form-choice{
  display:flex;
  align-items:center;
  gap:16px;

  min-height:70px;
  padding:16px 20px;

  background:#fff;
  color:#000;

  border:4px solid #000;
  border-radius:20px;
  box-shadow:6px 6px 0 #000;

  cursor:pointer;

  transition:
    transform .1s ease,
    box-shadow .1s ease,
    background-color .1s ease;
}

.fattoria-event-form .fattoria-event-form-choice:hover{
  transform:translate(-2px,-2px);
  box-shadow:8px 8px 0 #000;
}

.fattoria-event-form-choice:has(input:checked){
  background:var(--f-yellow);
  transform:translate(4px,4px);
  box-shadow:0 0 0 #000;
}

/* RADIO */
.fattoria-event-form input[type=radio]{
  appearance:none;

  width:26px;
  height:26px;
  margin:0;
  flex-shrink:0;

  background:#fff;

  border:3px solid #000;
  border-radius:50%;
  box-shadow:2px 2px 0 #000;
}

.fattoria-event-form input[type=radio]:checked{
  background:var(--f-pink);
  box-shadow:
    inset 0 0 0 5px #fff,
    2px 2px 0 #000;
}

/* INPUT */
.fattoria-event-form input:not([type=radio]):not([type=hidden]),
.fattoria-event-form textarea,
.fattoria-event-form select{
  display:block;

  width:100%;
  min-width:0;
  min-height:52px;

  margin-top:.45rem;
  padding:.75rem .9rem;

  background:#fff;
  color:#000;

  border:3px solid #000;
  border-radius:12px;
  box-shadow:3px 3px 0 #000;

  font:inherit;
}

.fattoria-event-form textarea{
  resize:vertical;
}

/* FOCUS */
.fattoria-event-form :focus-visible{
  outline:4px solid var(--f-yellow);
  outline-offset:4px;
}

.fattoria-event-form [aria-invalid=true]{
  border-color:var(--f-error)!important;
  box-shadow:3px 3px 0 var(--f-error)!important;
}

/* PACCHETTO / BLOCCO INFORMATIVO */
.fattoria-event-form-package{
  margin-bottom:1.5rem;
  padding:24px;

  background:var(--f-yellow);

  border:4px solid #000;
  border-radius:20px;
  box-shadow:6px 6px 0 #000;
}

.fattoria-event-form-package h3{
  margin:0 0 12px!important;

  color:#000!important;

  font-family:'Oswald',sans-serif!important;
  font-size:1.5rem!important;
  text-transform:uppercase;
}

.fattoria-event-form-package h4{
  margin:1.2rem 0 .5rem!important;

  color:#000!important;

  font-family:'Oswald',sans-serif;
  font-size:1.05rem;
  text-transform:uppercase;
}

.fattoria-event-form-package strong{
  display:block;
}

.fattoria-event-form-package ul{
  margin:1rem 0 1rem 1.3rem;
}

.fattoria-event-form-package p{
  margin:0;
}

.fattoria-event-form-package p + p{
  margin-top:1rem;
}

.fattoria-event-form-package .fattoria-event-form-availability{
  margin:1rem 0;
  padding:14px 16px;

  background:#fff;

  border:3px solid #000;
  border-radius:12px;
  box-shadow:3px 3px 0 #000;
}

/* NOTE CAMPI */
.fattoria-event-form-field-note{
  display:block;
  margin-top:.5rem;

  font-size:.9rem;
  font-weight:500;
}

/* ERRORI CAMPO */
.fattoria-event-form-field-error{
  display:block;

  margin-top:.5rem;
  padding:8px 10px;

  background:#fff0eb;
  color:#7d201a;

  border:2px solid var(--f-error);
  border-radius:8px;

  font-size:.9rem;
  font-weight:700;
}

/* ERRORE GENERALE */
.fattoria-event-form-error{
  margin-bottom:1.25rem;
  padding:16px;

  background:#fff0eb;
  color:#7d201a;

  border:3px solid var(--f-error);
  border-radius:12px;
  box-shadow:3px 3px 0 var(--f-error);

  overflow-wrap:anywhere;
}

/* SUCCESSO */
.fattoria-event-form-success{
  padding:20px;

  background:#dff4e1;

  border:4px solid #000;
  border-radius:16px;
  box-shadow:5px 5px 0 #000;

  font-weight:700;
}

/* BOTTONI */
.fattoria-event-form-actions{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:1.75rem;
}

.fattoria-event-form-actions button{
  flex:1 1 160px;

  min-height:52px;
  padding:0 30px;

  background:var(--f-yellow);
  color:#000;

  border:3px solid #000;
  border-radius:12px;
  box-shadow:4px 4px 0 #000;

  font-family:'Oswald',sans-serif;
  font-size:1.05rem;
  font-weight:700;
  text-transform:uppercase;

  cursor:pointer;

  transition:
    transform .1s ease,
    box-shadow .1s ease,
    background-color .1s ease;
}

.fattoria-event-form-actions button:hover{
  background:#fff;
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 #000;
}

.fattoria-event-form-actions .fattoria-event-btn-back{
  background:var(--f-blue);
  color:#000;
}

.fattoria-event-form-actions button:disabled{
  opacity:.6;
  cursor:wait;
}

/* RIEPILOGO */
.fattoria-event-form-summary{
  margin:0;
  padding:20px;

  background:#fff;

  border:3px solid #000;
  border-radius:16px;
  box-shadow:4px 4px 0 #000;
}

.fattoria-event-form-summary dt{
  margin-bottom:4px;

  color:#000;

  font-family:'Oswald',sans-serif;
  font-weight:700;
  text-transform:uppercase;
}

.fattoria-event-form-summary dd{
  margin:0 0 1rem;
  overflow-wrap:anywhere;
  white-space:pre-wrap;
}

/* LINK */
.fattoria-event-form a{
  color:#000;
  font-weight:700;
  text-decoration:underline;
}

/* HONEYPOT */
.fattoria-event-form .fattoria-event-form-trap{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}

/* CALENDARIO */
.fattoria-event-form-calendar{
  margin-top:.5rem;
  padding:12px;

  background:#fff;

  border:3px solid #000;
  border-radius:14px;
  box-shadow:3px 3px 0 #000;
}

.fattoria-event-form-calendar-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;

  font-family:'Oswald',sans-serif;
  font-weight:700;
  text-transform:uppercase;
}

.fattoria-event-form-calendar button{
  width:100%;
  min-height:40px;
  padding:.3rem;

  background:#fff;
  color:#000;

  border:2px solid #000;
  border-radius:8px;
  box-shadow:2px 2px 0 #000;

  font:inherit;
  font-weight:700;

  cursor:pointer;
}

.fattoria-event-form-calendar-nav button{
  width:44px;
  min-height:44px;
  flex-shrink:0;

  background:var(--f-yellow);
}

.fattoria-event-form-calendar table{
  width:100%;
  table-layout:fixed;

  margin:.75rem 0;
  border:0;
  border-collapse:separate;
  border-spacing:4px;
}

.fattoria-event-form-calendar caption{
  font-size:.85rem;
  text-align:left;
}

.fattoria-event-form-calendar th,
.fattoria-event-form-calendar td{
  border:0;
  padding:0;
  text-align:center;
  font-size:.85rem;
}

.fattoria-event-form-calendar button:disabled{
  background:#ececec;
  color:#777;
  cursor:not-allowed;
  border-color:#aaa;
  box-shadow:none;
  text-decoration:line-through;
}

.fattoria-event-form-calendar button[aria-pressed=true]{
  background:var(--f-pink);
  color:#fff;
  border-color:#000;
  box-shadow:2px 2px 0 #000;
}

.fattoria-event-form-calendar p{
  margin:.5rem 0 0;
  font-size:.85rem;
}

/* DESKTOP */
@media(min-width:600px){
  .fattoria-event-form-grid,
  .fattoria-event-form-options{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .fattoria-event-form-summary{
    display:grid;
    grid-template-columns:1fr 2fr;
    gap:.8rem 1.2rem;
  }

  .fattoria-event-form-summary dd{
    margin:0;
  }
}

/* MOBILE */
@media(max-width:850px){
  .fattoria-event-form{
    margin:1rem auto;
    padding:25px 12px;

    border-radius:16px;
    box-shadow:6px 6px 0 #000;
  }

  .fattoria-event-form h2{
    margin-bottom:20px!important;
    font-size:22px!important;
  }

  .fattoria-event-form-progress{
    margin-bottom:18px;
  }

  .fattoria-event-form .fattoria-event-step{
    padding:20px 15px;
    border-radius:16px;
    box-shadow:5px 5px 0 #000;
  }

  .fattoria-event-step legend{
    margin-bottom:16px;
    font-size:1.35rem;
  }

  .fattoria-event-form-options{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .fattoria-event-form .fattoria-event-form-choice{
    min-height:80px;
    padding:10px 12px;

    border-radius:12px;
    box-shadow:4px 4px 0 #000;

    flex-direction:column;
    justify-content:center;

    text-align:center;
  }

  .fattoria-event-form-choice:has(input:checked){
    transform:translate(2px,2px);
  }

  .fattoria-event-form input[type=radio]{
    width:22px;
    height:22px;
  }

  .fattoria-event-form-package{
    padding:18px;
    border-radius:14px;
    box-shadow:4px 4px 0 #000;
  }

  .fattoria-event-form-actions{
    gap:10px;
  }

  .fattoria-event-form-actions button{
    min-height:48px;
    padding:0 18px;
    font-size:.95rem;
  }
}

@media(max-width:480px){
  .fattoria-event-form-options{
    grid-template-columns:1fr;
  }
}

/* =========================================
   REFINEMENT BOX / TITLE POSITION
   ========================================= */

/* più respiro tra box verde e card bianca */
.fattoria-event-form{
  padding:70px 36px;
}

/* badge step con un po' più di aria sotto */
.fattoria-event-form-progress{
  margin:0 auto 34px;
}

/* card bianca più staccata e più leggibile */
.fattoria-event-form .fattoria-event-step{
  margin-top:10px;
  padding:34px 26px 28px;
  background:#f8f6f1;
}

/* il titolo "Che evento vuoi organizzare?" deve stare DENTRO il box */
.fattoria-event-step legend{
  display:block;
  width:100%;
  margin:0 0 24px 0;
  padding:0;
  line-height:1.15;
  position:static;
}

/* opzioni un po' più staccate dal titolo */
.fattoria-event-form-options{
  margin-top:6px;
}

/* sui desktop le card hanno più aria */
.fattoria-event-form .fattoria-event-form-choice{
  min-height:74px;
  padding:18px 20px;
}

/* pulsante continua staccato dal box */
.fattoria-event-form-actions{
  margin-top:24px;
}

/* mobile / tablet */
@media (max-width: 850px){
  .fattoria-event-form{
    padding:28px 14px;
  }

  .fattoria-event-form-progress{
    margin:0 auto 22px;
  }

  .fattoria-event-form .fattoria-event-step{
    margin-top:8px;
    padding:22px 16px 18px;
  }

  .fattoria-event-step legend{
    margin:0 0 18px 0;
    font-size:1.2rem;
  }

  .fattoria-event-form .fattoria-event-form-choice{
    min-height:76px;
    padding:12px;
  }
}


/* =========================================================
   LEGEND DENTRO LA CARD
   Il browser normalmente appoggia <legend> sul bordo.
   Con float:left diventa un vero titolo interno al fieldset.
   ========================================================= */

.fattoria-event-form .fattoria-event-step > legend{
  float:left;
  display:block;
  width:100%;

  margin:0 0 28px 0 !important;
  padding:0 !important;

  color:#000 !important;
  font-family:'Oswald','Impact',sans-serif !important;
  font-size:1.8rem !important;
  font-weight:500;
  line-height:1.15 !important;
  text-transform:uppercase;
}

/* fa iniziare il contenuto DOPO il titolo */
.fattoria-event-form .fattoria-event-step > legend + *{
  clear:both;
}

/* più aria vera dentro la card bianca */
.fattoria-event-form .fattoria-event-step{
  padding:38px 32px 32px !important;
}

/* distanza tra badge PASSAGGIO e box */
.fattoria-event-form-progress{
  margin-bottom:30px !important;
}

@media(max-width:850px){
  .fattoria-event-form .fattoria-event-step{
    padding:24px 18px 20px !important;
  }

  .fattoria-event-form .fattoria-event-step > legend{
    margin-bottom:20px !important;
    font-size:1.3rem !important;
  }
}


/* ==========================================================
   SHELL ESTERNA
   Astra può rendere full-width questa shell.
   La vera card resta invece limitata e centrata.
   ========================================================== */

.fattoria-event-form-shell{
  width:100%;
  max-width:none;
  padding:40px 60px;
  box-sizing:border-box;
}

/* vera card del modulo */
.fattoria-event-form-shell > .fattoria-event-form{
  width:100% !important;
  max-width:1180px !important;
  margin:0 auto !important;
}

/* tablet */
@media(max-width:1024px){
  .fattoria-event-form-shell{
    padding:32px;
  }
}

/* mobile */
@media(max-width:600px){
  .fattoria-event-form-shell{
    padding:20px 14px;
  }

  .fattoria-event-form-shell > .fattoria-event-form{
    width:100% !important;
    margin:0 auto !important;
  }
}


/* CARD MODULO PIÙ STRETTA - EFFETTO CARD REALE */
.fattoria-event-form-shell{
  width:100%;
  padding:48px 24px !important;
}

.fattoria-event-form-shell > .fattoria-event-form{
  width:100% !important;
  max-width:980px !important;
  margin:0 auto !important;
}

@media(max-width:1024px){
  .fattoria-event-form-shell{
    padding:32px 20px !important;
  }

  .fattoria-event-form-shell > .fattoria-event-form{
    max-width:900px !important;
  }
}

@media(max-width:700px){
  .fattoria-event-form-shell{
    padding:20px 12px !important;
  }

  .fattoria-event-form-shell > .fattoria-event-form{
    max-width:100% !important;
  }
}


.fattoria-event-form-intro{
  max-width:720px;
  margin:0 auto 28px !important;
  color:#ffffff;
  text-align:center;
  font-size:1.05rem;
  font-weight:500;
  line-height:1.5;
}

@media(max-width:850px){
  .fattoria-event-form-intro{
    margin-bottom:20px !important;
    font-size:.95rem;
  }
}


/* Paragrafi informativi dentro le card */
.fattoria-event-step .fattoria-event-form-intro{
  max-width:100%;
  margin:0 0 22px !important;
  color:#000;
  text-align:left;
  font-size:1rem;
  font-weight:500;
  line-height:1.55;
}

.fattoria-event-step .fattoria-event-form-intro:last-of-type{
  margin-bottom:0 !important;
}


.fattoria-event-form-privacy{
  margin-top:18px !important;
  margin-bottom:0 !important;
  font-size:.9rem;
}

.fattoria-event-form-privacy a{
  color:#000;
  font-weight:600;
}


/* ==========================================================
   FIX LEGEND FLOAT
   Tutti i contenuti dopo il legend devono iniziare sotto
   al titolo, anche quando il primo elemento è hidden.
   ========================================================== */

.fattoria-event-form .fattoria-event-step > legend ~ *{
  clear:both;
}


/* MOBILE: radio a sinistra e testo a destra */
@media(max-width:850px){

  .fattoria-event-form .fattoria-event-form-choice{
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:14px !important;
    text-align:left !important;
  }

  .fattoria-event-form .fattoria-event-form-choice input[type=radio]{
    flex:0 0 auto !important;
    margin:0 !important;
  }

  .fattoria-event-form .fattoria-event-form-choice span{
    flex:1 1 auto !important;
    display:block !important;
    text-align:left !important;
  }

}