.elementor-2848 .elementor-element.elementor-element-e157cf1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2848 .elementor-element.elementor-element-e19b5ea > .elementor-widget-container{margin:0px 0px 50px 0px;padding:0px 16px 0px 16px;}.elementor-2848 .elementor-element.elementor-element-e19b5ea{color:#FFFFFF;}.elementor-2848 .elementor-element.elementor-element-e19b5ea a:hover, .elementor-2848 .elementor-element.elementor-element-e19b5ea a:focus{color:#A9F5B3;}.elementor-2848 .elementor-element.elementor-element-6de6d1b{text-align:center;}.elementor-2848 .elementor-element.elementor-element-6de6d1b .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:3.3rem;font-weight:400;}@media(max-width:767px){.elementor-2848 .elementor-element.elementor-element-6de6d1b .elementor-heading-title{font-size:2.3rem;}}/* Start custom CSS for shortcode, class: .elementor-element-3202765 */.elementor-element-e157cf1 {
  padding-inline: 16px !important;
}

.visit-form {
  --input-background: white;

  background: white;
  padding: 30px 16px;
  border-radius: 20px;
  margin-inline: auto;
  margin-top: 15px;
  width: 100%;
  max-width: 768px !important;

  @media (width >= 768px) {
    padding: 30px;
  }

  & .tutor .title,
  & .students .title,
  & .visit .title {
    color: #006235;
    font-size: 1.45rem;
    font-weight: bold;
    display: inline-flex;
    flex-direction: column;
    line-height: initial;
    
    @media (width >= 768px) {
      align-items: center;
      flex-direction: row;
      gap: 10px;
      line-height: var(--go--line-height);
    }
  }

  & label {
    color: #002f19;

    & input,
    & select,
    & textarea {
      background: var(--input-background) !important;
      border: 1px solid #e5e8ec;
      border-radius: 6px;
    }
  }

  & input,
  & select,
  & textarea {
    background: var(--input-background) !important;
    border: 1px solid #e5e8ec;
    border-radius: 6px;
  }

  & .students {
    margin-bottom: 30px;
    position: relative;
  }

  .wpcf7-field-groups {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding-bottom: 55px;

    @media (width >= 768px) {
      padding-inline: 20px;
    }
  }

  .wpcf7-field-group {
    padding: 20px;
    border: 1px solid #e5e8ec;
    border-radius: 6px;
  }

  .wpcf7-field-group:has(+ .wpcf7-field-group) .wpcf7-field-group-add,
  .wpcf7-field-group:has(+ .wpcf7-field-group) .wpcf7-field-group-remove {
    display: none !important;
  }

  .wpcf7-field-group input {
    margin-bottom: 10px !important;
  }

  .wpcf7-field-group-add {
    display: inline-block;
    position: absolute;
    left: 50%;
    bottom: 0px;
    color: transparent;
    background: white;
    border: 1px dashed #006235;
    border-radius: 4px;
    width: 100%;
    transform: translateX(-50%);
    transition: background 300ms;
    font-family: sans-serif !important;
    padding: 10px 16px;
    font-size: 13.5px;

    @media (width >= 768px) {
      width: 94.45%;
    }

    &::before {
      --size: 16px;
      
      display: inline-block;
      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%23006235' d='M12 20q-.213 0-.357-.144T11.5 19.5v-7h-7q-.213 0-.356-.144T4 11.999t.144-.356t.356-.143h7v-7q0-.213.144-.356T12.001 4t.356.144t.143.356v7h7q.213 0 .356.144t.144.357t-.144.356t-.356.143h-7v7q0 .213-.144.356t-.357.144'/%3E%3C/svg%3E");
      width: var(--size);
      height: var(--size);
      translate: 0px 2.2px;
    }

    &::after {
      content: "Agregar otro estudiante";
      color: #006235;
      font-size: 1rem;
      transition: color 300ms;
    }

    &:hover {
      background: color-mix(in srgb, #006235, transparent 85%);
    }
  }

  & .wpcf7-field-group-remove {
    display: inline-block;
    font-size: 13.5px;
    background: white;
    color: transparent;
    font-family: sans-serif !important;
    padding: 6px 10px 9px;
    margin-top: 6px;
    transition: background 300ms;

    &::before {
      --size: 18px;

      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%23ff2c2c' d='M7 4a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v2h4a1 1 0 1 1 0 2h-1.069l-.867 12.142A2 2 0 0 1 17.069 22H6.93a2 2 0 0 1-1.995-1.858L4.07 8H3a1 1 0 0 1 0-2h4zm2 2h6V4H9zM6.074 8l.857 12H17.07l.857-12zM10 10a1 1 0 0 1 1 1v6a1 1 0 1 1-2 0v-6a1 1 0 0 1 1-1m4 0a1 1 0 0 1 1 1v6a1 1 0 1 1-2 0v-6a1 1 0 0 1 1-1'/%3E%3C/svg%3E");
      display: inline-block;
      width: var(--size);
      height: var(--size);
      translate: 0px 2px;
    }

    &::after {
      content: "Eliminar";
      color: #ff2c2c;
      transition: color 300ms;
    }

    &:hover {
      background: color-mix(in srgb, #ff2c2c, transparent 85%);
    }
  }

  & .visit {
    display: flex;
    flex-direction: column;
    gap: 16px;

    & .title {
      margin-bottom: 0px;
    }

    & .info {
      display: flex;
      gap: 16px;
      color: #006235;
      border: 1px solid color-mix(in srgb, #006235, transparent 65%);
      border-radius: 6px;
      padding: 10px;
      margin-bottom: 8px;

      & .visit-info-text {
        display: flex;
        flex-direction: column;
        gap: 4px;

        & p {
          margin-bottom: 0px;
          line-height: initial;
          font-size: 0.9rem;

          &:first-child {
            font-weight: bold;
            font-size: 1rem;
          }
        }
      }
    }

    & .date {
      & .wpcf7-date {
        margin-bottom: 0px;
      }

      & p {
        font-size: 0.9rem;
      }
    }

    & .time {
      & .time-title {
        color: #002f19;
        margin-bottom: 0px;
      }

      & .wpcf7-form-control-wrap {
        display: block;
      }

      & .wpcf7-form-control {
        display: flex;
        flex-direction: column;
        gap: 8px;
      }

      & .wpcf7-list-item {
        display: block;
        margin-left: 0;
        border: 1px solid #e5e8ec;
        border-radius: 6px;
        padding: 8px;
        cursor: pointer;

        & label {
          margin-bottom: 0px;
          display: flex;
          align-items: center;
          gap: 8px;
          cursor: inherit;

          & input[type="radio"] {
            opacity: 1;
            accent-color: #006235;
          }

          & span {
            color: initial;
          }
        }
      }
    }
  }

  & .message {
    margin-block: 30px;

    & .title {
      color: #002f19;
      font-weight: bold;
      display: inline-flex;
      flex-direction: column;

      @media (width >= 768px) {
        align-items: center;
        flex-direction: row;
        gap: 10px;
      }
    }

    & textarea {
      height: 150px;
      max-height: 200px;
      resize: vertical !important;
      margin-bottom: 0px;
    }

    & .legend {
      font-size: 0.9rem;
      color: var(--go--color--text);
    }
  }

  & input[type="submit"] {
    --background: #008849;

    background: var(--background) !important;
    width: 100%;
    padding: 16px;
    font-family: Sans-Serif !important;
    font-size: 1.15rem !important;

    &:hover,
    &:active {
      background: color-mix(in srgb, var(--background), black 20%) !important;
    }
  }

  @media (width >= 768px) {
    & .inputs-cols {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 32px;
    }
  }
}/* End custom CSS */