/* Estructura Principal */
.calculadora-global-container {
    position: relative;
    overflow: hidden; /* Evita que el modal cause scroll si algo sale mal */
    border-radius: 23px; /* Opcional: si quieres borde redondeado general */
}

.calculadora-container {
    display: grid;
    grid-template-columns: 2fr 3fr;
    grid-template-areas: "columna-izquierda mapa";
    gap: 20px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    align-items: center;
    transition: filter 0.3s ease; /* Transición por si usamos blur en futuro */
}

.calculadora-columna-izquierda {
    grid-area: columna-izquierda;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.mapa-wrapper {
    grid-area: mapa;
}

/* Contenedores */
.form-wrapper,
.calculadora-results-wrapper {
    border-radius: 23px;
    padding: 30px;
    box-shadow: -9px 0px 14px -10px rgba(0, 0, 0, 0.5);
}
.form-wrapper { background-color: #f2f2f2; }
.calculadora-results-wrapper { background-color: #329881; color: white; }

/* Responsive */
@media (max-width: 1024px) and (min-width: 801px) { /* Tablet */
    .mapa-wrapper svg { max-height: 500px; width: auto; margin: 0 auto; }
    .calculadora-container { align-items: start; }
}
@media (max-width: 800px) { /* Móvil */
    .calculadora-container {
        grid-template-columns: 1fr;
        grid-template-areas: "mapa" "columna-izquierda";
        align-items: start;
    }
    .mapa-wrapper svg { max-height: none; width: 100%; }
}

/* Mapa */
.mapa-wrapper svg { width: 100%; height: auto; box-sizing: border-box; }
.mapa-wrapper svg path { fill: #ccc; stroke: #fff; stroke-width: 1.5px; transition: fill 0.2s ease; cursor: pointer; }
.mapa-wrapper svg path:hover { fill: #b0b0b0; }
.mapa-wrapper svg path.active { fill: #329881; }

/* Formularios y Resultados */
.form-group { margin-bottom: 20px; }
.form-group:last-child { margin-bottom: 0; }
.form-group label { display: block; margin-bottom: 8px; font-weight: bold; }
.form-group select { width: 100%; }

.calculadora-results-wrapper h3, .calculadora-results-wrapper h4, .calculadora-results-wrapper strong { color: white; }
.calculadora-results-wrapper hr { border: none; border-top: 1px solid white; margin: 10px 0 !important; }

#hidden-calculation-data,
#results-breakdown,
.calculadora-results-wrapper hr,
.results-summary p { display: none; }

.results-summary h4 { margin-top: 0; margin-bottom: 0; }
.calculadora-results-wrapper h3 { margin-bottom: 15px; }

/* Botones dentro de resultados */
#cta-ver-cotizacion button, #solicitar-contacto-btn {
    position: relative; font-family: "Menu", Sans-serif; font-weight: 500; font-size: 16px; border: none; border-radius: 30px;
    padding: 15px 60px 15px 25px; width: 100%; cursor: pointer; text-align: center; transition: all 0.3s ease; margin-top: 15px;
}
#cta-ver-cotizacion button::after, #solicitar-contacto-btn::after {
    content: ''; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 35px; height: 35px; border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FFFFFF'%3E%3Cpath d='M16.1716 10.9999L10.8076 5.63589L12.2218 4.22168L20 11.9999L12.2218 19.778L10.8076 18.3638L16.1716 12.9999H4V10.9999H16.1716Z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 60%; transition: transform 0.25s ease;
}
#cta-ver-cotizacion button:hover::after, #solicitar-contacto-btn:hover::after { transform: translateY(-50%) translateX(5px); }
#cta-ver-cotizacion button:hover, #solicitar-contacto-btn:hover { box-shadow: 0 5px 15px rgba(0,0,0,0.1); }

#ver-cotizacion-btn { background-color: white; color: #329881; }
#ver-cotizacion-btn::after { background-color: #329881; }
#ver-cotizacion-btn:disabled { background-color: #e0e0e0; color: #a0a0a0; cursor: not-allowed; box-shadow: none; transform: none; }
#ver-cotizacion-btn:disabled::after { background-color: #a0a0a0; }

#solicitar-contacto-btn { background-color: #c1ff72; color: #333; }
#solicitar-contacto-btn::after { background-color: #329881; }
#solicitar-contacto-btn:disabled { background-color: #a0a5aa; color: white; cursor: not-allowed; box-shadow: none; transform: none; }
#solicitar-contacto-btn:disabled::after { background-color: #6f757b; }

/* Selects */
.select2-container--default .select2-selection--single { height: 42px !important; border: 1px solid #329881 !important; border-radius: 6px !important; }
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 40px !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 40px !important; }
.form-group select:not(#municipio) { border: 1px solid #329881; border-radius: 6px; height: 42px; padding: 0 10px; }

/* Formulario Modal */
#contacto-modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.6); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
    display: flex; justify-content: center; align-items: center; z-index: 2000;
    opacity: 0; visibility: hidden; /* Oculto por defecto */
    transition: opacity 0.3s ease, visibility 0s linear 0.3s; /* Transición para ocultar */
}
#contacto-modal-overlay.visible { /* Clase para mostrar */
    opacity: 1; visibility: visible;
    transition: opacity 0.3s ease;
}

.contacto-modal-form-box {
    background-color: white; padding: 30px; border-radius: 10px; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
    width: 90%; max-width: 500px; text-align: center;
    transform: scale(0.9); /* Efecto de escala inicial */
    transition: transform 0.3s ease;
}
#contacto-modal-overlay.visible .contacto-modal-form-box {
    transform: scale(1); /* Animación de escala al mostrar */
}

.contacto-modal-form-box h3 { margin-top: 0; margin-bottom: 20px; color: #333; }
.modal-form-group { margin-bottom: 15px; text-align: left; }
.modal-form-group label { display: block; margin-bottom: 5px; font-weight: bold; color: #555; }
.modal-form-group input { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 6px; box-sizing: border-box; }
#modal-submit-btn, #modal-close-btn {
    padding: 12px 25px; border: none; border-radius: 6px; cursor: pointer;
    font-size: 16px; transition: background-color 0.3s ease; width: 100%; margin-top: 10px;
}
#modal-submit-btn { background-color: #329881; color: white; }
#modal-submit-btn:hover { background-color: #277c68; }
#modal-close-btn { background-color: #ccc; color: #333; }
#modal-close-btn:hover { background-color: #b0b0b0; }
#modal-recaptcha-container { margin-top: 15px; display: flex; justify-content: center; }