/* ==========================================================================
   Form richiedi valutazione — mobile first (valori Figma × --figma-px)
   ========================================================================== */

.valuation-form-block {
  background-color: var(--color-athens-gray);
}

.valuation-form-block .container {
  padding-inline: var(--container-padding-x);
}

.valuation-form-block__shell {
  padding-block: 52px;
}

.valuation-form-block__card {
  display: flex;
  flex-direction: column;
  gap: calc(var(--figma-px) * 52);
  padding: calc(var(--figma-px) * 52) calc(var(--figma-px) * 30);
  background-color: var(--color-white);
  border-radius: calc(var(--figma-px) * 28.5);
}

.valuation-form-block__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--fs-48-min);
  font-size: var(--fs-48);
  font-weight: 700;
  line-height: 1;
  color: var(--color-nolves-blue);
}

.valuation-form-block__intro-text {
  display: flex;
  flex-direction: column;
  gap: calc(var(--figma-px) * 32);
  font-family: var(--font-body);
  font-size: var(--fs-32-min);
  font-size: var(--fs-32);
  font-weight: 400;
  line-height: var(--lh-32-body);
  color: var(--color-oxford-blue);
}

.valuation-form-block__intro-text p {
  margin: 0;
}

.valuation-form-block__intro-text a {
  color: inherit;
  text-decoration: underline;
}

.valuation-form-block__intro {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.valuation-form-block__empty {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-22-min);
  font-size: var(--fs-22);
  line-height: var(--lh-22);
  color: var(--color-oxford-blue);
}

/* CF7 layout
   -------------------------------------------------------------------------- */

.valuation-form-block__form .wpcf7 {
  width: 100%;
}

.valuation-form-block__form .wpcf7-form {
  margin: 0;
}

.valuation-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 10px;
}

.valuation-form__field {
  margin: 0;
}

.valuation-form__field--half,
.valuation-form__field--full,
.valuation-form__field--message,
.valuation-form__field--upload,
.valuation-form__field--submit,
.valuation-form__field--acceptance,
.valuation-form__field--fuel {
  grid-column: 1 / -1;
}

.valuation-form__field--year,
.valuation-form__field--hours {
  grid-column: span 1;
}

.valuation-form__field .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

.valuation-form__control {
  box-sizing: border-box;
  width: 100%;
  min-height: calc(var(--figma-px) * 96);
  padding: calc(var(--figma-px) * 23.42) calc(var(--figma-px) * 30);
  border: calc(var(--figma-px) * 1.39) solid var(--color-border-gray);
  border-radius: calc(var(--figma-px) * 31.22);
  background-color: var(--color-athens-gray-2);
  font-family: var(--font-heading);
  font-size: min(31.22px, 4.46vw);
  font-size: calc(var(--figma-px) * 31.22);
  font-weight: 400;
  line-height: 1.2;
  color: var(--color-ebony);
}

.valuation-form__control::placeholder {
  color: var(--color-pale-sky);
}

.valuation-form__control:focus {
  border-color: var(--color-nolves-blue);
  outline: none;
}

.valuation-form__field--message .valuation-form__control {
  min-height: calc(var(--figma-px) * 200);
  resize: vertical;
}

select.valuation-form__control {
  appearance: none;
  padding-inline-end: calc(var(--figma-px) * 60);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10' fill='none'%3E%3Cpath d='M1 1.5L8 8.5L15 1.5' stroke='%236A7282' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right calc(var(--figma-px) * 24) center;
  background-size: calc(var(--figma-px) * 16) auto;
  cursor: pointer;
}

.valuation-form__field--upload .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

.valuation-form__upload-label {
  display: block;
  margin-bottom: calc(var(--figma-px) * 12);
  font-family: var(--font-body);
  font-size: var(--fs-22-min);
  font-size: calc(var(--figma-px) * 22);
  font-weight: 600;
  line-height: calc(var(--figma-px) * 28.6);
  color: var(--color-oxford-blue);
}

.valuation-form__file-input-wrap {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.valuation-form__field--upload {
  position: relative;
}

.valuation-form__file-ui {
  display: flex;
  flex-direction: column;
  gap: calc(var(--figma-px) * 14);
}

.valuation-form__file-dropzone {
  display: flex;
  align-items: center;
  gap: calc(var(--figma-px) * 20);
  box-sizing: border-box;
  width: 100%;
  min-height: calc(var(--figma-px) * 120);
  padding: calc(var(--figma-px) * 24) calc(var(--figma-px) * 30);
  border: calc(var(--figma-px) * 1.39) dashed var(--color-border-gray);
  border-radius: calc(var(--figma-px) * 31.22);
  background-color: var(--color-athens-gray-2);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.valuation-form__file-dropzone:hover,
.valuation-form__file-dropzone:focus-visible {
  border-color: var(--color-nolves-blue);
  background-color: var(--color-white);
  outline: none;
  box-shadow: 0 0 0 calc(var(--figma-px) * 2) rgb(39 53 126 / 12%);
}

.valuation-form__file-dropzone.is-dragover,
.valuation-form__field--upload.has-files .valuation-form__file-dropzone {
  border-style: solid;
  border-color: var(--color-nolves-blue);
  background-color: var(--color-white);
}

.valuation-form__file-icon {
  flex-shrink: 0;
  width: calc(var(--figma-px) * 48);
  height: calc(var(--figma-px) * 48);
  border-radius: calc(var(--figma-px) * 14);
  background-color: rgb(39 53 126 / 8%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 16V4M12 4L8 8M12 4L16 8' stroke='%2327357E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 16V17C4 18.6569 5.34315 20 7 20H17C18.6569 20 20 18.6569 20 17V16' stroke='%2327357E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: calc(var(--figma-px) * 24) calc(var(--figma-px) * 24);
}

.valuation-form__file-copy {
  display: flex;
  flex-direction: column;
  gap: calc(var(--figma-px) * 6);
  min-width: 0;
}

.valuation-form__file-lead {
  font-family: var(--font-heading);
  font-size: min(28px, 4vw);
  font-size: calc(var(--figma-px) * 28);
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-nolves-blue);
}

.valuation-form__file-action {
  font-family: var(--font-body);
  font-size: min(24px, 3.4vw);
  font-size: calc(var(--figma-px) * 24);
  line-height: 1.35;
  color: var(--color-oxford-blue);
}

.valuation-form__file-meta {
  font-family: var(--font-body);
  font-size: var(--fs-22-min);
  font-size: calc(var(--figma-px) * 22);
  line-height: calc(var(--figma-px) * 28.6);
  color: var(--color-pale-sky);
}

.valuation-form__file-list {
  display: flex;
  flex-direction: column;
  gap: calc(var(--figma-px) * 10);
  margin: 0;
  padding: 0;
  list-style: none;
}

.valuation-form__file-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(var(--figma-px) * 16);
  padding: calc(var(--figma-px) * 14) calc(var(--figma-px) * 18);
  border: calc(var(--figma-px) * 1) solid var(--color-border-gray);
  border-radius: calc(var(--figma-px) * 16);
  background-color: var(--color-white);
}

.valuation-form__file-name {
  overflow: hidden;
  font-family: var(--font-body);
  font-size: calc(var(--figma-px) * 22);
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-ebony);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.valuation-form__file-size {
  flex-shrink: 0;
  font-family: var(--font-body);
  font-size: calc(var(--figma-px) * 20);
  line-height: 1.3;
  color: var(--color-pale-sky);
}

.valuation-form__file {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.valuation-form__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: calc(var(--figma-px) * 95);
  padding: calc(var(--figma-px) * 24) calc(var(--figma-px) * 30);
  border: 0;
  border-radius: calc(var(--figma-px) * 31.81);
  background-color: var(--color-nolves-blue);
  font-family: var(--font-body);
  font-size: min(31.81px, 4.544vw);
  font-size: calc(var(--figma-px) * 31.81);
  font-weight: 600;
  line-height: 1.5;
  color: var(--color-white);
  cursor: pointer;
}

.valuation-form__field--submit {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.valuation-form__field--submit .valuation-form__submit {
  width: auto;
  max-width: 100%;
}

.valuation-form-block__form .wpcf7-spinner {
  margin: 0;
  flex-shrink: 0;
}

.valuation-form__field--acceptance .wpcf7-list-item {
  margin: 0;
}

.valuation-form__field--acceptance label {
  display: flex;
  align-items: flex-start;
  gap: calc(var(--figma-px) * 14);
  font-family: var(--font-body);
  font-size: var(--fs-22-min);
  font-size: calc(var(--figma-px) * 22);
  font-weight: 400;
  line-height: calc(var(--figma-px) * 28.6);
  color: var(--color-pale-sky);
}

.valuation-form__acceptance {
  flex-shrink: 0;
  width: calc(var(--figma-px) * 39);
  height: calc(var(--figma-px) * 39);
  margin-top: calc(var(--figma-px) * 2);
  accent-color: var(--color-nolves-blue);
}

.valuation-form__field--acceptance a {
  color: inherit;
  text-decoration: underline;
}

.valuation-form-block__form .wpcf7-not-valid-tip {
  margin-top: calc(var(--figma-px) * 8);
  font-size: calc(var(--figma-px) * 18);
  color: var(--color-service);
}

.valuation-form-block__form .wpcf7-response-output {
  margin: calc(var(--figma-px) * 24) 0 0;
  padding: calc(var(--figma-px) * 16);
  border-radius: calc(var(--figma-px) * 12);
  font-family: var(--font-body);
  font-size: calc(var(--figma-px) * 22);
  line-height: 1.4;
}

/* Desktop — min-width 768px
   -------------------------------------------------------------------------- */

@media (min-width: 768px) {
  .valuation-form-block__shell {
    padding-block: 52px;
  }

  .valuation-form-block__card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    padding: 40px;
    border-radius: 20px;
  }

  .valuation-form-block__title {
    font-size: 24px;
    line-height: 1.1;
  }

  .valuation-form-block__intro {
    gap: 24px;
  }

  .valuation-form-block__intro-text {
    gap: 0;
    font-size: var(--fs-body-desktop);
    line-height: var(--lh-body-desktop);
  }

  .valuation-form__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px 10px;
  }

  .valuation-form__field--half {
    grid-column: span 3;
  }

  .valuation-form__field--year {
    grid-column: span 2;
  }

  .valuation-form__field--hours {
    grid-column: span 2;
  }

  .valuation-form__field--fuel {
    grid-column: span 2;
  }

  .valuation-form__field--full,
  .valuation-form__field--message,
  .valuation-form__field--upload,
  .valuation-form__field--submit,
  .valuation-form__field--acceptance {
    grid-column: 1 / -1;
  }

  .valuation-form__control {
    min-height: 45px;
    padding: 10px 31px;
    border-width: 1.39px;
    border-radius: 16px;
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 18.2px;
  }

  select.valuation-form__control {
    padding-inline-end: 48px;
    background-position: right 16px center;
    background-size: 12px auto;
  }

  .valuation-form__field--message .valuation-form__control {
    min-height: 147px;
  }

  .valuation-form__upload-label {
    margin-bottom: 8px;
    font-size: 11px;
    line-height: 14.3px;
  }

  .valuation-form__file-ui {
    gap: 10px;
  }

  .valuation-form__file-dropzone {
    min-height: 88px;
    padding: 16px 20px;
    gap: 14px;
    border-width: 1px;
    border-radius: 16px;
  }

  .valuation-form__file-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-size: 20px 20px;
  }

  .valuation-form__file-lead {
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 18px;
  }

  .valuation-form__file-action {
    font-size: 13px;
    line-height: 18px;
  }

  .valuation-form__file-meta {
    font-size: 11px;
    line-height: 14.3px;
  }

  .valuation-form__file-item {
    gap: 12px;
    padding: 10px 14px;
    border-radius: 12px;
  }

  .valuation-form__file-name {
    font-size: 13px;
  }

  .valuation-form__file-size {
    font-size: 11px;
  }

  .valuation-form__field--submit {
    justify-self: start;
  }

  .valuation-form__submit {
    width: auto;
    min-height: 36px;
    padding: 13px 30px;
    border-radius: 13px;
    font-size: 14px;
    line-height: 20px;
  }

  .valuation-form__field--acceptance label {
    gap: 14px;
    font-size: 11px;
    line-height: 14.3px;
  }

  .valuation-form__acceptance {
    width: 15px;
    height: 15px;
    margin-top: 0;
  }

}

/* Contatto rapido CF7
   -------------------------------------------------------------------------- */

.quick-contact-form__row {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
}

.quick-contact-form__row .valuation-form__field--third {
  grid-column: auto;
  min-width: 0;
}

.quick-contact-form .valuation-form__field--message .valuation-form__control {
  min-height: calc(var(--figma-px) * 96);
  resize: vertical;
}

@media (min-width: 768px) {
  .quick-contact-form .valuation-form__field--message .valuation-form__control {
    min-height: 72px;
  }
}
