.calculator-form-with-result {
  .conditions {
    margin-top: 40px;
  }

  .steps-nav__list {
    display: none;

    @media (--viewport-ms-max) {
      display: block;
      position: fixed;
      z-index: 13;
      background-color: var(--color-background);
      box-shadow: 0px 10px 5px 0px #0000000d;
      width: 100%;
      padding: 16px 20px 69px; /*aumentamos padding bottom para tapar los botones del header en scroll (si no el tamaño era 15px 20px 55px (CA.R.))  */
      margin: 0 -31px 32px;
      top: 0;
      left: 31px;

      ul {
        .steps-nav__list-item.active {
          .steps-nav__list-item-step {
            .text {
              display: block;
              position: absolute;
              top: 80px;
              left: 20px;
            }
          }
        }
      }
    }

    @media (--viewport-xs-max) {
      left: 20px;
      margin: 0 -20px 32px;
    }

    &.no-text {
      @media (--viewport-ms-max) {
        padding-bottom: 16px;
      }
    }
  }

  .block {
    margin-bottom: 60px;
    /* se suma a los 20px que todos los campos tienen debajo (CA. R.) */

    &:last-child {
      margin-bottom: 0;
    }

    .subtitle {
      display: flex;
      flex-direction: column;
      gap: 24px; /* Visto en CYR y añadido en general para unificar (CA.R.)*/
      margin-bottom: 32px;

      [class*='icon-54'] {
        width: 54px;
        height: 54px;
      } /* Modificado para que no afecte a CYR que lo lleva a 56 que es el tamaño que marcan las Foundations (CA.R.)*/
    }

    .form-list {
      .prelabel {
        .title-s {
          color: var(--color-text-accent-bold);
        }
      }

      .alert.inline .alert__wrap {
        margin: 30px 0;
      }
    }
  }

  @media (--viewport-ms-max) {
    form {
      margin-bottom: 40px;
    }
  }

  @media (--viewport-xs-max) {
    .card-result {
      margin: 0 -20px;

      &.swiper-slide {
        margin: 0;
      }
    }
  }

  #month {
    text-transform: capitalize;
  }

  .prelabel {
    display: flex;
    justify-items: flex-start;
    align-items: flex-end;

    .tooltip {
      margin-bottom: -45px;
      margin-left: -25px;
    }
  }

  .card-result-swiper.scroll {
    @media (--viewport-ms-max) {
      margin: 0 -20px;
    }
  }

  /* Para ajustar alturas de línea de la card dentro del componente */
  
  .card-result-payment-single {
    .item {
      .card-result-payment-single__item-number li .bodycopy-l{
        top: -4px;
        @media (--viewport-sm-max) {
          top: -3px;
        }
        @media (--viewport-xs-max) {
          top: -2px;
        }
      }
      ul.breakdown {
        li {
          .breakdown-text {
            .bodycopy-m {
              margin-top: 5px;
              text-align: left;
            }
            .tooltip{
              top:11px;
            }
            @media (--viewport-sm-max) {
              .bodycopy-m {
                margin-top: 3px;
              }
              .tooltip{
                top:9px;
              }
            }
            @media (--viewport-xs-max) {
              .bodycopy-m {
                margin-top: 0;
              }
              .tooltip{
                top:6px;
              }
            }
          }
          .title-m{
            white-space: nowrap;
          }
        }
      }
    }
  }
  /* FIN Para ajustar alturas de línea de la card dentro del componente */
}