.etapa-editor {
  width: -webkit-fill-available;
  min-width: 150px;

  h3 {
    margin: 0;
    margin-bottom: 8px;
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    border-bottom: 1px solid #00000025;
  }

  .block-editor-rich-text__editable {
    white-space: pre-wrap;
    min-width: 1px;
    border: 1px solid #00000085;
    padding: 5px;
    margin: 12px 0;
    font-size: 13px;
    font-weight: 400;
    border-radius: 3px;
  }

  .components-base-control {
    border-top: 1px solid #00000025;
    padding: 12px 0;

    .components-base-control__field {
      margin: 0;

      .components-select-control {
        .components-flex-item {
          label {
            font-weight: 700;
            font-size: 15px;
          }
        }

        .components-input-control__container {
          border-radius: 3px;
        }
      }
    }
  }

  .etapa-links-editor {
    padding: 12px 0;
    border-top: 1px solid #00000025;

    h4 {
      margin: 0;
      margin-bottom: 8px;
      font-weight: 700;
      font-size: 15px;
    }

    .etapa-link-editor {
      margin-bottom: 24px;
      .components-base-control {
        border: 0;

        input {
          border-radius: 3px;
        }
      }

      .components-button {
        border: 1px solid #cc1818;
        padding: 4px;
        font-size: 11px;
        background: white;
        color: #cc1818 !important;
      }
    }
  }

  .is-destructive {
    background: #cc1818;
    color: white !important;
    font-size: 14px;
    font-weight: 700;
  }
}

.wp-block-my-theme-my-block .my-block-item h2 {
  margin-bottom: 10px;
}
.wp-block-my-theme-my-block .my-block-item img {
  width: 100px;
  height: 200px;
  display: block;
  margin-top: 10px;
}

.wp-block-my-theme-my-block .my-block-item img {
  margin-top: 0 !important;
}
.custom-block-item .components-button {
  margin-right: 10px;
  padding: 0;
  height: auto;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
}

.wp-block-my-theme-my-block .custom-block-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-bottom: 20px;
}
.wp-block-my-theme-my-block .btn-remove-item {
  background-color: #f00;
  color: #ffffff !important;
  padding: 5px 10px;
  border-radius: 4px;
  cursor: pointer;
}

.bloco-etapa-editor {
  display: flex;
}

.etapa-editor {
  padding: 10px;
  border: solid 1px #000000;
  margin: 5px;
  border-radius: 5px;
}

/* ------------------------------------------------------------------------------------------ */
.etapas-do-programa {
  /*apenas se a pagina for container fluid */
  padding: 0px 0px 40x;
  background: #f9f9f9;

  .etapas-do-projeto-bloco {
    padding: 40px 0;

    .line {
      position: relative;
      border-bottom: 1px solid #e6e6e6;
      top: 41px;
    }

    .etapas-do-projeto-title {
      h2 {
        font-family: "AvenirNextLTPro";
        font-size: 32px;
        font-weight: 700;
        color: #30302e;
        margin-bottom: 32px;
        text-align: center;
      }
    }

    .etapas-do-programa-card {
      justify-content: space-evenly;
      position: relative;

      .etapa {
        .etapa-texts {
          display: grid;
          justify-content: center;
          text-align: center;
          gap: 8px;
          margin-bottom: 8px;

          .etapa-text {
            font-size: 16px;
            font-weight: 400;
            color: #565654;
            margin: 0;
          }
        }
        .etapa-header {
          display: flex;
          flex-direction: column;
          margin-bottom: 8px;
          align-items: center;
          text-align: center;
          gap: 8px;

          .etapa-title {
            font-family: "AvenirNextLTPro" !important;
            font-size: 14px;
            font-weight: 700;
            color: #1d1d1b;
            margin: 0;
          }

          .etapa-state-completa {
            display: flex;
            padding: 0px 12px;
            height: 32px;
            border: 2px solid #004f9f;
            background: white;
            border-radius: 999px;
            font-size: 14px;
            font-weight: 700;
            color: #004f9f;
            align-items: center;
            width: fit-content;

            .etapa-completa {
              display: flex;
              gap: 8px;
              align-items: center;
            }
          }

          .etapa-state-em-andamento {
            display: flex;
            padding: 0 12px;
            height: 32px;
            border: 2px solid #004f9f;
            border-radius: 999px;
            font-size: 14px;
            font-weight: 700;
            background: #004f9f;
            color: white;
            align-items: center;
            width: fit-content;
          }

          .etapa-state-numerico {
            width: 32px;
            height: 32px;
            background-color: #fff;
            border: 1px solid #e6e6e6;
            color: #004f9f;
            border-radius: 50%;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
          }
        }

        .etapa-links {
          display: grid;
          justify-content: center;
          text-align: center;
          gap: 8px;

          a {
            font-size: 16px;
            font-weight: 400;
            display: flex;
            align-items: center;
            gap: 4px;

            .link-svg-icon {
              margin-right: 4px;
            }

            .link-svg-indicator {
              margin-left: 4px;
            }
          }
        }
      }
    }
  }
}

@media only screen and (min-width: 720px) and (max-width: 1900px) {
  .etapa {
    max-width: 360px;
  }
}

.etapa-links svg{
	min-width:20px
}