:root {
  --color-limon-atom: #57d398;
  --color-verde-atom: #013c4a;
  --color-marron-atom: #b2b496;
  --color-verde-atom-claro: #cbe880;
}

.atom-full-bleed-bg {
  position: absolute;
  top: 0;
  left: 71.5%;
  transform: translateX(-50%);
  width: 100.5vw; /* más que 100vw para cubrir borde derecho */
  height: 100%;
  background-color: var(--color-marron-atom);
  z-index: 0;
  pointer-events: none;
}

.atom-full-bleed-bg-lemon {
  position: absolute;
  top: 0;
  left: 71.5%;
  transform: translateX(-50%);
  width: 100.5vw; /* más que 100vw para cubrir borde derecho */
  height: 100%;
  background-color: var(--color-verde-atom);
  z-index: 0;
  pointer-events: none;
}

.atom-full-image-bg {
  position: absolute;
  top: 0;
  left: 71.5%;
  transform: translateX(-50%);
  width: 100.5vw; /* más que 100vw para cubrir borde derecho */
  height: 100%;
  z-index: 0;
  pointer-events: none;
}

.atom-full-opacity-bg {
  position: absolute;
  top: 0;
  left: 71.5%;
  transform: translateX(-50%);
  width: 100.5vw; /* más que 100vw para cubrir borde derecho */
  height: 100%;
  z-index: 0;
  pointer-events: none;
}
.tab-slider::-webkit-scrollbar {
  display: none; /* Oculta barra en Chrome */
}

.tab-slider {
  scrollbar-width: none; /* Oculta barra en Firefox */
}

.custom-bullet {
  transition: all 0.3s;
}

.custom-bullet-active {
  opacity: 1 !important;
  width: 12px;
  height: 12px;
  background-color: #5fd399 !important;
}

@media (min-width: 800px) and (max-width: 1366px) {
  .atomrange\:text-md {
    font-size: 1rem;
    line-height: 1rem;
  }

  /* Agrega más clases personalizadas aquí según lo que necesites */
}

@media (min-width: 100px) and (max-width: 800px) {
  .atom-full-bleed-bg {
    left: 50%;
  }

  .atom-full-bleed-bg-lemon {
    left: 50%;
  }
  .atom-full-image-bg {
    left: 50%;
  }
  .atom-full-opacity-bg {
    left: 50%;
  }
}

@media (min-width: 824px) and (max-width: 1020px) {
  .atom-full-bleed-bg {
    left: 50%;
  }

  .atom-full-bleed-bg-lemon {
    left: 50%;
  }
  .atom-full-image-bg {
    left: 50%;
  }
  .atom-full-opacity-bg {
    left: 50%;
  }
}

.terminos-condiciones h2 {
  font-size: 1.2rem;
  font-weight: 500;
  color: #013c4a;
  margin-bottom: 1rem;
}

.terminos-condiciones p {
  font-size: 1rem;
  font-weight: 400;
  color: #013c4a;
  margin-bottom: 1rem;
}

.terminos-condiciones div ul {
  list-style-type: disc;
  list-style-position: inside;
  color: #013c4a;
  margin-bottom: 1rem;
  padding-left: 0;
  padding-left: 1.5rem;
}

.terminos-condiciones div ol {
  list-style-type: decimal;
  list-style-position: inside;
  color: #013c4a;
  margin-bottom: 1rem;
  padding-left: 0;
  padding-left: 1.5rem;
}

.terminos-condiciones div ul li {
  margin-bottom: 0.5rem;
}

.blog-info h2 {
  font-size: 1.5rem;
  font-weight: 500;
  color: #013c4a;
  margin-bottom: 1rem;
}

.blog-info p {
  font-size: 1rem;
  font-weight: 400;
  text-align: justify;
  color: #013c4a;
  margin-bottom: 1rem;
}

.blog-info div ul {
  list-style-type: disc;
  list-style-position: inside;
  color: #013c4a;
  margin-bottom: 1rem;
  padding-left: 0;
  padding-left: 1.5rem;
}

.blog-info div ol {
  list-style-type: decimal;
  list-style-position: inside;
  color: #013c4a;
  margin-bottom: 1rem;
  padding-left: 0;
  padding-left: 1.5rem;
}

.blog-info div ul li {
  margin-bottom: 0.5rem;
}

/* Inputs y select */
.custom-form .form-input {
  background-color: transparent;
  border: 1px solid #b2b496;
  padding: 0.5rem 1rem;
  color: #b2b496;
  font-size: 0.875rem;
  width: 100%;
}
.custom-form select.form-input option:first-child {
  color: #000;
}

.custom-form .form-input::placeholder {
  color: #b2b496;
}

input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  border: 2px solid #b2b496;
  border-radius: 50%;
  background-color: transparent;
  cursor: pointer;
  position: relative;
  top: 4px;
}

/* Checkboxes estilo circular */
.custom-form .form-checkbox input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  border-radius: 50%;
  height: 1rem;
  width: 1rem;
  border: 2px solid #b2b496;
  background-color: transparent;
  transition: all 0.2s ease-in-out;
  margin: 0;
  top: 4px;
}
.custom-form .form-checkbox input[type="checkbox"]:checked {
  background-color: #b2b496;
  border-color: #b2b496;
}

/* Botón */
.custom-form .form-button {
  margin-top: 1rem;
  background-color: #b2b496;
  color: #013c4a;
  font-size: 1.125rem;
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: background-color 0.3s;
}
.custom-form .form-button:hover {
  background-color: var(--color-limon-atom);
  color: var(--color-verde-atom);
}

.custom-form select.form-input {
  appearance: none;
}

.wpcf7-not-valid-tip {
  color: var(--color-limon-atom) !important;
  font-size: 0.8rem !important;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
  color: var(--color-verde-atom-claro) !important;
  border: 1px solid var(--color-verde-atom-claro) !important;
  font-size: 0.8rem !important;
}

.wpcf7-list-item {
  margin-left: 0px !important;
}

.wpcf7-list-item-label {
  color: var(--color-marron-atom) !important;
}

.wpcf7 form.sent .wpcf7-response-output {
  color: #46b450 !important;
}

.atom-cursor-lupa {
  cursor: url("../images/lupa.svg") 16 16, auto;
}

.atom-cursor-lupa-sm {
  cursor: url("../images/lupa_xs.svg") 12 12, auto;
}


/* Formulario Aliados */

.form-aliados .form-input2 {
  background-color: transparent;
  border: 1px solid var(--color-verde-atom);
  padding: 1rem 1rem;
  color: var(--color-verde-atom);
  font-size: 1rem;
  width: 100%;
}

.form-aliados .form-input2:focus{
  outline: none; /* quita el borde azul por defecto */
  border-color: var(--color-marron-atom); /* ejemplo */
  background-color: rgba(0, 0, 0, 0.005);
}

.form-aliados .wpcf7-select{
  padding: 0.8rem 1rem;
}

.form-aliados .custom-form2 select.form-input2 option:first-child {
  color: #000;
}

.form-aliados.custom-form2 .form-input2::placeholder {
  color: var(--color-verde-atom) !important;
}

.form-aliados input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 25px;
  height: 25px;
  border: 2px solid var(--color-verde-atom);
  border-radius: 50%;
  background-color: transparent;
  cursor: pointer;
  position: relative;
  top: 6px;
}

/* Checkboxes estilo circular */
.form-aliados .custom-form2 .form-checkbox input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  border-radius: 50%;
  height: 1rem;
  width: 1rem;
  border: 2px solid var(--color-verde-atom-claro);
  background-color: var(--color-verde-atom-claro);
  transition: all 0.2s ease-in-out;
  margin: 0;
  top: 4px;
}
.form-aliados input[type="checkbox"]:checked {
  background-color: var(--color-verde-atom);
  border-color: var(--color-verde-atom);
}

/* Botón */
.form-aliados .custom-form2 .form-button {
  margin-top: 1rem;
  background-color: var(--color-verde-atom);
  color: var(--color-limon-atom);
  font-size: 1.125rem;
  padding: 1rem 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: background-color 0.3s;
}
.form-aliados .custom-form2 .form-button:hover {
  background-color: var(--color-limon-atom);
  color: var(--color-verde-atom);
}

.form-aliados .custom-form2 select.form-input {
  appearance: none;
}

.form-aliados .wpcf7-not-valid-tip {
  color: var(--color-verde-atom) !important;
  font-size: 0.8rem !important;
}

.form-aliados .wpcf7 form.invalid .wpcf7-response-output,
.form-aliados .wpcf7 form.unaccepted .wpcf7-response-output,
.form-aliados .wpcf7 form.payment-required .wpcf7-response-output {
  color: #d42c2ce3 !important;
  border: 1px solid #d42c2ce3 !important;
  font-size: 1rem !important;
}

.form-aliados .wpcf7-list-item {
  margin-left: 0px !important;
}

.form-aliados .wpcf7-list-item-label {
  color: var(--color-verde-atom) !important;
  font-size: 1rem;
}

.form-aliados .wpcf7 form.sent .wpcf7-response-output {
  color: #46b450 !important;
}


/* Estilos para el formulario de vender terreno */

/* Ocultar el input original */
.custom-form3 input[type="file"].form-input3 {
  display: none;
}

/* Estilo de la caja clicable */
.custom-form3 .file-upload-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px dashed var(--color-verde-atom);
  padding: 1.2rem 1rem;
  border-radius: 6px;
  cursor: pointer;
  background-color: #fff;
  width: 100%;
  box-sizing: border-box;
}

.custom-form3 .file-upload-box span {
  color: var(--color-verde-atom);
  font-weight: bold;
}

.custom-form3 .file-upload-box small {
  color: #777;
  font-size: 0.875rem;
  margin-left: 5px;
}

.form-aliados .form-input2::placeholder{
  color: var(--color-verde-atom);
  font-weight: 500;
}

.custom-form3 .wpcf7-form-control-wrap[data-name="file-553"] {
  display: block;
}

.custom-form3 .wpcf7-form-control-wrap[data-name="file-553"] {
  display: block;
}

.form-vender .wpcf7-list-item.first.last label .wpcf7-list-item-label{
  display: none;
}