/* Estilo automático para a página: simulador */
.btSidebar,
.awmaps3d .sidebarMap {
    display: none !important;
}
.awmaps3d .controlsMap.open {
    left: 20px !important;
}

.modal-backdrop {
    display: none !important;
}

.bl-lot {
    transition: all .3s;
    opacity: 0.75;

    .lot-marker {
        opacity: 0;
        transition: all .3s;
        position: absolute;
        top: 28px;
        right: 28px;
        width: 40px;
        height: 40px;
        background-color: #CC3A5C;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;

        svg {
            width: 20px;
            
        }
    }

    &:hover {
        opacity: 0.85;
    }    

}

input:checked + label {
    .bl-lot {
        opacity: 1;

        .lot-marker {
            opacity: 1;
        }
    }
}

.simulador {
    .tab-etapa {
        display: none;

        .titulo-secao {
            margin-bottom: 60px;

            h2 {
                color: #002B2C;
                font-family: Inter;
                font-size: 32px;
                font-style: normal;
                font-weight: 700;
                line-height: 125%; /* 40px */
                letter-spacing: -0.64px;
                text-align: center;
            }
        }
        
        .descritivo-etapa {
            color: #5D5D5D;
            text-align: center;
            font-family: Inter;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 140%; /* 22.4px */
        }

        .wrapper-ranger {
            padding: 40px;
            border-radius: 20px;
            border: 1px solid #E3E7ED;
            background: #FFF;
            box-shadow: 0 10px 20px 0 rgba(78, 78, 78, 0.12);

            .custom-label {
                color: #65758B;
                font-family: Inter;
                font-size: 16px;
                font-style: normal;
                font-weight: 500;
                line-height: 160%; /* 25.6px */
                letter-spacing: -0.32px;
            }

            .output-numerico {
                color: #002B2C;
                font-family: Inter;
                font-size: 32px;
                font-style: normal;
                font-weight: 700;
                line-height: 160%; /* 51.2px */
                letter-spacing: -0.64px;
            }

            .button-range {
                border-radius: 48px;
                border: 1px solid #E3E7ED;
                background-color: transparent;
                color: #7F8C9F;
                width: 48px;
                height: 48px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 32px;
            }
        }

        .box-mapa {
            border-radius: 20px;
            position: relative;
            z-index: 1;
            height: 540px;
            /* background-color: #409a75; */
            
            .bg-load {
                border-radius: 20px;
                background-color: #409a75;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                position: absolute;
                top: 0;
                z-index: 2;
                width: 100%;
                height: 100%;

                font-family: Inter;
                font-size: 14px;
                font-style: normal;
                font-weight: 500;
                line-height: 160%;
                color: #fff;

                p {
                    margin-top: 15px;
                }
            }

            #mapa {
                border-radius: 20px;

                &.blur {
                    filter: blur(5px);
                }
            }
        }

        label {
            color: #65778F;
            font-family: Inter;
            font-size: 15px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            letter-spacing: -0.3px;
        }

        .select-wrapper {
            display: flex;
            flex-direction: column;

            .custom-select {
                padding: 14px;
                border-radius: 8px;
                border: 1px solid #E3E7ED;
                background: #FFF;
                margin-top: 5px;
                margin-bottom: 20px;
                color: #5D5D5D;
                font-family: Inter;
                font-size: 16px;
                font-style: normal;
                font-weight: 500;
                line-height: normal;
                letter-spacing: -0.32px;
                height: 48px;

                &::placeholder,
                option {
                    color: #5D5D5D;
                }
            }
        }

        input[type="text"],
        input[type="email"],
        input[type="tel"] {
            width: 100%;
            border-radius: 8px;
            border: 1px solid #E3E7ED;
            background: #FFF;
            height: 48px;
            color: #5D5D5D;
            font-family: Inter;
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            letter-spacing: -0.32px;
            padding-left: 15px;
        }

        .btn-box {
            margin-top: 35px;

            .btn-selecionar-unidade,
            .avancar-etapa {
                display: inline-flex;
                align-items: center;
                gap: 3px;
                border-radius: 80px;
                background: #E9426E;
                height: auto;
                padding: 15px 30px;
                line-height: 90%;
                font-weight: 400;
                font-size: 15px;
                min-height: 45px;
                justify-content: center;
                border: solid 1px transparent;
                transition: all .3s;
                color: #FFF;
                font-family: Inter;
                font-size: 16px;
                font-style: normal;
                font-weight: 500;
                line-height: normal;
                letter-spacing: -0.32px;
                box-shadow: 0 6px 20px 0 rgba(204, 58, 92, 0.35);
        
                &:disabled {
                    opacity: 0.6;
        
                    &:hover {
                        cursor: default;
                    }
                }
            }
        
            .retornar-etapa {
                border-radius: 80px;
                border: 1px solid #65778F;
                background-color: #FFF;
                display: inline-flex;
                align-items: center;
                gap: 3px;
                color: #65778F;
                font-family: Inter;
                font-size: 16px;
                font-style: normal;
                font-weight: 500;
                line-height: normal;
                letter-spacing: -0.32px;
                padding: 15px 30px;
            }
        }

        .etapa-resultado {
            border-radius: 20px;
            border: 1px solid #E3E7ED;
            background: #FFF;
            box-shadow: 0 10px 20px 0 rgba(78, 78, 78, 0.12);
            padding: 40px 32px;

            h3 {
                color: #CC3A5C;
                font-family: Inter;
                font-size: 18px;
                font-style: normal;
                font-weight: 600;
                line-height: 160%; /* 28.8px */
                letter-spacing: -0.36px;
                text-decoration-line: underline;
                text-decoration-style: solid;
                text-decoration-skip-ink: auto;
                text-decoration-thickness: auto;
                text-underline-offset: auto;
                text-underline-position: from-font;
            }
            h4 {
                color: #65758B;
                font-family: Inter;
                font-size: 16px;
                font-style: normal;
                font-weight: 500;
                line-height: 160%; /* 25.6px */
                letter-spacing: -0.32px;
            }
            h5 {
                color: #5D5D5D;
                font-family: Inter;
                font-size: 18px;
                font-style: normal;
                font-weight: 600;
                line-height: 160%; /* 28.8px */
                letter-spacing: -0.36px;
            }
        }
    }

}

input[type="range"] {
  -webkit-appearance: none;
  width: calc(100% - 116px);
  height: 6px;
  border-radius: 999px;
  outline: none;
  cursor: pointer;

  /* Gradiente animado */
  background: linear-gradient(
    to right,
    #e5486d 0%,
    #e5486d var(--value, 0%),
    #e5e5e5 var(--value, 0%),
    #e5e5e5 100%
  );

  transition: background 0.25s ease;
}

/* Track */
input[type="range"]::-webkit-slider-runnable-track {
  height: 6px;
  background: transparent;
}

input[type="range"]::-moz-range-track {
  height: 6px;
  background: #e5e5e5;
  border-radius: 999px;
}

/* Progress (Firefox) */
input[type="range"]::-moz-range-progress {
  background: #e5486d;
  height: 6px;
  border-radius: 999px;
  transition: all 0.25s ease;
}

/* Thumb */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  background: #e5486d;
  border-radius: 50%;
  border: none;
  margin-top: -6px;

  box-shadow: 0 2px 6px rgba(0,0,0,0.2);

  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  background: #e5486d;
  border-radius: 50%;
  border: none;

  box-shadow: 0 2px 6px rgba(0,0,0,0.2);

  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

/* Hover */
input[type="range"]:hover::-webkit-slider-thumb,
input[type="range"]:hover::-moz-range-thumb {
  transform: scale(1.15);
}

/* Active (efeito "pressionado") */
input[type="range"]:active::-webkit-slider-thumb,
input[type="range"]:active::-moz-range-thumb {
  transform: scale(1.25);
  box-shadow: 0 0 0 6px rgba(229, 72, 109, 0.2);
}