/* Chef Academy - checkout in 2 step
   Design system ripreso da /inizia-b/ (Playfair Display + Karla). */

.chef-ck,
.chef-ck-step1 .woocommerce,
.chef-ck-step1 form.checkout {
  --green: #008c45;
  --green-d: #00763a;
  --green-t: #e8f6ef;
  --gold: #d4af37;
  --gold-soft: #f3e6c0;
  --red: #c0392b;
  --ink: #1c130d;
  --dark: #141210;
  --cream: #fdf8f3;
  --cream-2: #f5ede8;
  --card: #fff;
  --muted: #7a6e62;
  --line: #ece0d4;
  --r-lg: 26px;
  --r-md: 18px;
  --r-sm: 13px;
  --sh-1: 0 1px 2px rgba(28, 19, 13, .05), 0 4px 16px rgba(28, 19, 13, .06);
  --sh-2: 0 10px 34px rgba(28, 19, 13, .13);
  --sh-green: 0 12px 34px rgba(0, 140, 69, .24);
}

.chef-ck,
.chef-ck * {
  box-sizing: border-box;
}

.chef-ck {
  font-family: Karla, system-ui, -apple-system, sans-serif;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.6;
}

.chef-ck h1,
.chef-ck h2,
.chef-ck h3 {
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -.01em;
  margin: 0 0 .5em;
}

.chef-ck h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); }
.chef-ck h3 { font-size: clamp(1.15rem, 2vw, 1.45rem); }

/* ---------- indicatore di avanzamento ---------- */

.chef-ck-progress {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 28px;
  flex-wrap: wrap;
}

.chef-ck-progress__i {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 16px 8px 8px;
  border-radius: 100px;
  background: var(--cream-2);
  color: var(--muted);
  font-size: 14px;
  font-weight: 500;
  flex: 1 1 auto;
  min-width: 0;
}

.chef-ck-progress__n {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px var(--line);
}

.chef-ck-progress__l {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.chef-ck-progress__i.is-corrente {
  background: var(--green-t);
  color: var(--green-d);
}

.chef-ck-progress__i.is-corrente .chef-ck-progress__n {
  background: var(--green);
  color: #fff;
  box-shadow: none;
}

.chef-ck-progress__i.is-fatto {
  background: var(--green-t);
  color: var(--green-d);
}

.chef-ck-progress__i.is-fatto .chef-ck-progress__n {
  background: var(--green);
  color: #fff;
  box-shadow: none;
}

/* ---------- il form WooCommerce del passo 1 ---------- */

.chef-ck-step1 .woocommerce-billing-fields h3,
.chef-ck-step1 #order_review_heading {
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 500;
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  color: var(--ink);
  text-transform: none;
  letter-spacing: -.01em;
  margin: 0 0 18px;
}

/* WooCommerce imposta il checkout su due colonne al 47%: la seconda qui è vuota
   (niente note ordine né spedizione), quindi il form restava schiacciato a metà.
   Gli si ridà tutta la larghezza della colonna. */
.chef-ck-step1 #customer_details,
.chef-ck-step1 #customer_details .col2-set,
.chef-ck-step1 #customer_details .col-1 {
  width: 100%;
  max-width: none;
  float: none;
  padding: 0;
}

.chef-ck-step1 #customer_details .col-2 {
  display: none;
}

/* Nome e cognome affiancati con una griglia, al posto dei float al 47%
   che lasciavano gli input larghi meno di 90px. */
.chef-ck-step1 .woocommerce-billing-fields__field-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 16px;
}

.chef-ck-step1 .woocommerce-billing-fields__field-wrapper > .form-row,
.chef-ck-step1 .woocommerce-billing-fields__field-wrapper > .form-row-first,
.chef-ck-step1 .woocommerce-billing-fields__field-wrapper > .form-row-last,
.chef-ck-step1 .woocommerce-billing-fields__field-wrapper > .form-row-wide {
  padding: 0;
  margin: 0 0 16px;
  width: 100%;
  max-width: none;
  float: none;
  clear: none;
}

.chef-ck-step1 .woocommerce-billing-fields__field-wrapper > .form-row-wide,
.chef-ck-step1 .woocommerce-billing-fields__field-wrapper > .chef-ck-hidden {
  grid-column: 1 / -1;
}

.chef-ck-step1 .form-row {
  padding: 0;
  margin: 0 0 16px;
}

@media (max-width: 480px) {
  .chef-ck-step1 .woocommerce-billing-fields__field-wrapper {
    grid-template-columns: 1fr;
  }
}

.chef-ck-step1 .form-row label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 6px;
}

.chef-ck-step1 .form-row .required {
  color: var(--red);
  text-decoration: none;
}

.chef-ck-step1 input[type=text],
.chef-ck-step1 input[type=email],
.chef-ck-step1 input[type=tel],
.chef-ck-step1 input[type=password],
.chef-ck-step1 select,
.chef-ck .chef-ck-row input,
.chef-ck .chef-ck-row select {
  width: 100%;
  font-family: Karla, system-ui, sans-serif;
  font-size: 16px;
  color: var(--ink);
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm);
  padding: 14px 16px;
  line-height: 1.4;
  transition: border-color .15s ease, box-shadow .15s ease;
  -webkit-appearance: none;
  appearance: none;
}

.chef-ck-step1 input::placeholder,
.chef-ck .chef-ck-row input::placeholder {
  color: #b6aa9d;
}

.chef-ck-step1 input:focus,
.chef-ck-step1 select:focus,
.chef-ck .chef-ck-row input:focus,
.chef-ck .chef-ck-row select:focus {
  outline: 0;
  border-color: var(--green);
  box-shadow: 0 0 0 4px rgba(0, 140, 69, .13);
}

.chef-ck-step1 .woocommerce-invalid input {
  border-color: var(--red);
}

.chef-ck-step1 .form-row .description {
  font-size: 13px;
  color: var(--muted);
  margin: 6px 0 0;
}

.chef-ck-hidden {
  display: none !important;
}

/* caselle di consenso */

.chef-ck-legale {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 4px 0 18px;
}

.chef-ck-legale .chef-ck-consenso {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 13px 15px;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--muted);
  margin: 0;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}

.chef-ck-legale .chef-ck-consenso:has(input:checked) {
  background: var(--green-t);
  border-color: #bfe4d0;
}

.chef-ck-legale .chef-ck-consenso input[type=checkbox] {
  flex: 0 0 19px;
  width: 19px;
  height: 19px;
  margin: 1px 0 0;
  accent-color: var(--green);
  cursor: pointer;
}

.chef-ck-legale .chef-ck-consenso a {
  color: var(--green-d);
  text-decoration: underline;
}

.chef-ck-legale .required {
  color: var(--red);
  border: 0;
  text-decoration: none;
}

/* blocchi non usati nel passo 1 */

.chef-ck-step1 .woocommerce-additional-fields,
.chef-ck-step1 .woocommerce-shipping-fields,
.chef-ck-step1 .woocommerce-form-coupon-toggle,
.chef-ck-step1 .checkout_coupon,
.chef-ck-step1 .woocommerce-form-login-toggle {
  display: none !important;
}

/* riepilogo ordine */

.chef-ck-step1 .woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
  margin: 0 0 18px;
}

.chef-ck-step1 .woocommerce-checkout-review-order-table th,
.chef-ck-step1 .woocommerce-checkout-review-order-table td {
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  text-align: left;
}

.chef-ck-step1 .woocommerce-checkout-review-order-table thead th {
  font-size: 12.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
  background: transparent;
}

.chef-ck-step1 .woocommerce-checkout-review-order-table tbody td {
  border-bottom: 0;
  vertical-align: top;
}

.chef-ck-step1 .woocommerce-checkout-review-order-table tfoot .order-total th,
.chef-ck-step1 .woocommerce-checkout-review-order-table tfoot .order-total td {
  font-size: 19px;
  font-weight: 700;
  border-bottom: 0;
  border-top: 1px solid var(--line);
  background: #fff;
}

/* riepilogo compatto */

.chef-ck-tabella .product-total {
  text-align: right;
  font-size: 19px;
  font-weight: 700;
  white-space: nowrap;
}

.chef-ck-tabella thead .product-total {
  font-size: 12.5px;
  font-weight: 700;
}

.chef-ck-tabella__nome {
  font-size: 16.5px;
  font-weight: 700;
  color: var(--ink);
}

.chef-ck-tabella__q {
  color: var(--muted);
  font-weight: 400;
}

.chef-ck-tabella__rinnovo {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  color: var(--muted);
}

/* pagamenti */

.chef-ck-step1 #payment {
  background: transparent;
  border-radius: 0;
}

.chef-ck-step1 #payment ul.payment_methods {
  border: 0;
  padding: 0;
  margin: 0 0 16px;
  list-style: none;
}

.chef-ck-step1 #payment li.wc_payment_method {
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm);
  padding: 14px 16px;
  margin: 0 0 10px;
  background: #fff;
}

.chef-ck-step1 #payment li.wc_payment_method label {
  font-weight: 600;
  font-size: 15px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.chef-ck-step1 #payment div.payment_box {
  background: var(--cream);
  border-radius: var(--r-sm);
  margin: 12px 0 0;
  padding: 14px 16px;
  font-size: 14px;
  color: var(--muted);
}

.chef-ck-step1 #payment div.payment_box::before {
  display: none;
}

/* ---------- Apple Pay / Google Pay, bloccati finché mancano i consensi ---------- */

/* Il contenitore NON viene mai nascosto: Stripe misura lo spazio disponibile prima di
   disegnare il pulsante, e dentro un contenitore a dimensione zero non monta nulla.
   Non serve comunque: se il wallet non è disponibile, l'elemento Stripe resta vuoto e
   non occupa spazio. Si nascondono solo avviso e separatore, che sono roba nostra. */
.chef-ck-wallet {
  margin: 0;
}

.chef-ck-wallet.is-visibile {
  margin: 0 0 18px;
}

.chef-ck-wallet__sep {
  display: none;
}

.chef-ck-wallet.is-visibile .chef-ck-wallet__sep {
  display: flex;
}

.chef-ck-wallet__avviso {
  display: none;
  align-items: flex-start;
  gap: 9px;
  background: var(--gold-soft);
  border: 1px solid #e6d4a0;
  border-radius: var(--r-sm);
  padding: 11px 14px;
  margin: 0 0 12px;
  font-size: 13.5px;
  line-height: 1.45;
  color: #7a5f14;
}

.chef-ck-wallet.is-visibile.is-bloccato .chef-ck-wallet__avviso {
  display: block;
}

.chef-ck-wallet.is-bloccato .chef-ck-wallet__box {
  opacity: .4;
  filter: grayscale(1);
  pointer-events: none;
  user-select: none;
}

.chef-ck-wallet__box {
  transition: opacity .2s ease, filter .2s ease;
}

.chef-ck-wallet__sep {
  align-items: center;
  gap: 12px;
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.chef-ck-wallet__sep::before,
.chef-ck-wallet__sep::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line);
}

/* pulsanti */

.chef-ck-btn,
.chef-ck-step1 #place_order {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: Karla, system-ui, sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff !important;
  background: var(--green);
  border: 0;
  border-radius: 100px;
  padding: 17px 34px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: var(--sh-green);
  transition: background .15s ease, transform .15s ease;
  line-height: 1.2;
}

.chef-ck-btn:hover,
.chef-ck-step1 #place_order:hover {
  background: var(--green-d);
  color: #fff !important;
  transform: translateY(-1px);
}

.chef-ck-btn--full,
.chef-ck-step1 #place_order {
  width: 100%;
}

/* ---------- form del passo 2 ---------- */

.chef-ck-step2 {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: clamp(20px, 4vw, 34px);
  box-shadow: var(--sh-1);
}

.chef-ck-row {
  margin: 0 0 16px;
}

.chef-ck-row label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 6px;
}

.chef-ck-row .req { color: var(--red); }

.chef-ck-row .opt {
  color: var(--muted);
  font-weight: 400;
  font-size: 12.5px;
}

.chef-ck-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 16px;
}

.chef-ck-details {
  border: 1px dashed var(--line);
  border-radius: var(--r-sm);
  padding: 12px 16px;
  margin: 4px 0 20px;
  background: var(--cream);
}

.chef-ck-details summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 14.5px;
}

.chef-ck-details .chef-ck-grid {
  margin-top: 14px;
}

.chef-ck-nota {
  font-size: 13.5px;
  color: var(--muted);
  text-align: center;
  margin: 14px 0 0;
}

/* ---------- riepilogo post pagamento ---------- */

.chef-ck-riepilogo {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: clamp(20px, 4vw, 30px);
}

.chef-ck-riepilogo__ok {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--green-t);
  color: var(--green-d);
  font-weight: 700;
  font-size: 14px;
  padding: 7px 15px;
  border-radius: 100px;
  margin: 0 0 14px;
}

.chef-ck-riepilogo ul {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
}

.chef-ck-riepilogo li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
}

.chef-ck-riepilogo__tot {
  display: flex;
  justify-content: space-between;
  padding: 12px 0 0;
  font-size: 19px;
}

.chef-ck-riepilogo__mail {
  font-size: 13.5px;
  color: var(--muted);
  margin: 14px 0 0;
}

/* ---------- rassicurazioni ---------- */

.chef-ck-trust {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin: 22px 0;
}

.chef-ck-trust__i {
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 14px 15px;
}

.chef-ck-trust__ico { font-size: 20px; line-height: 1; }
.chef-ck-trust__t { font-weight: 700; font-size: 14px; }
.chef-ck-trust__d { font-size: 12.5px; color: var(--muted); }

.chef-ck-garanzia {
  display: flex;
  align-items: center;
  gap: 13px;
  background: var(--gold-soft);
  border-radius: var(--r-md);
  padding: 15px 18px;
  margin: 0 0 22px;
}

.chef-ck-garanzia__ico { color: var(--gold); font-size: 24px; }
.chef-ck-garanzia strong { display: block; font-size: 15px; }
.chef-ck-garanzia span { font-size: 13.5px; color: var(--muted); }

.chef-ck-aiuto {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 14.5px;
  color: var(--muted);
}

.chef-ck-aiuto a[href^="tel"] {
  color: var(--ink);
  font-weight: 700;
  text-decoration: none;
}

/* ---------- WhatsApp ---------- */

.chef-ck-wa {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #25d366;
  color: #fff !important;
  font-weight: 700;
  font-size: 14.5px;
  padding: 10px 18px;
  border-radius: 100px;
  text-decoration: none;
  transition: background .15s ease;
}

.chef-ck-wa:hover { background: #1da851; color: #fff !important; }

/* Sul checkout il chatbot e il badge Tutoring sono rimossi: qui sotto non c'è altro,
   quindi il pulsante può stare in basso senza doverli scavalcare. */
.chef-ck-wa--float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 9998;
  width: 54px;
  height: 54px;
  padding: 0;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(37, 211, 102, .4);
}

.chef-ck-wa--float svg { width: 27px; height: 27px; }

/* Nascosto mentre il pulsante di pagamento è a schermo, per non coprirlo. */
.chef-ck-wa--float.is-nascosto {
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  pointer-events: none;
}

.chef-ck-wa--float {
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
}

/* ---------- avvisi ---------- */

.chef-ck-avviso {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: clamp(22px, 4vw, 34px);
  text-align: center;
}

.chef-ck-avviso--ok { background: var(--green-t); border-color: #bfe4d0; }

.chef-ck .woocommerce-error,
.chef-ck .woocommerce-message,
.chef-ck-step1 .woocommerce-error,
.chef-ck-step1 .woocommerce-NoticeGroup {
  border-radius: var(--r-sm);
  font-size: 14.5px;
}

/* ---------- mobile ---------- */

@media (max-width: 600px) {
  .chef-ck-grid { grid-template-columns: 1fr; }

  .chef-ck-progress__l { display: none; }

  .chef-ck-progress__i {
    flex: 0 0 auto;
    padding: 8px;
    border-radius: 50%;
  }

  .chef-ck-progress__i.is-corrente {
    flex: 1 1 auto;
    border-radius: 100px;
    padding-right: 16px;
  }

  .chef-ck-progress__i.is-corrente .chef-ck-progress__l { display: block; }

  .chef-ck-btn,
  .chef-ck-step1 #place_order { font-size: 17px; padding: 16px 24px; }

  .chef-ck-wa--float { bottom: 16px; right: 16px; }
}