/*==========================================================*/
/* SECCIÓN DE BÚSQUEDA DE VUELOS (Mantenido) */
/*==========================================================*/

.flight-search-container {
    background-color: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
}

    .flight-search-container h2 {
        color: #333;
        margin-bottom: 15px;
        text-align: center;
    }

.flight-search-options label {
    margin-right: 15px;
}

.flight-search-inputs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) 150px;
    gap: 15px;
    margin-top: 20px;
    align-items: end;
}

.input-group {
    display: flex;
    flex-direction: column;
}

    .input-group label {
        margin-bottom: 5px;
        color: #555;
        font-size: 0.9em;
    }

    .input-group input[type="text"],
    .input-group input[type="date"],
    .input-group select {
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        font-size: 1em;
    }

.search-button {
    background-color: #D44628;
    color: #fff;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1.1em;
    margin-top: 20px;
    text-align: center;
}

    .search-button:hover {
        background-color: #a52f17;
    }

.more-options {
    margin-top: 15px;
    text-align: left;
}

@media (max-width: 768px) {
    .flight-search-inputs {
        grid-template-columns: 1fr;
    }
}

/*==========================================================*/
/* SECCIÓN DE DESTINOS POPULARES (ADAPTADA) */
/*==========================================================*/

.destinations-section {
    padding: 30px 20px;
    text-align: center;
}

    .destinations-section h2 {
        color: #333;
        margin-bottom: 25px;
    }

.destinations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 25px;
    margin-bottom: 30px;
}

.destination-card {
    background-color: #fff;
    border-radius: 8px;
    /* Sombra ligeramente mejorada para el nuevo diseño */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.3s ease-in-out;
    position: relative;
    display: flex; /* Para contener la imagen y la info */
    flex-direction: column;
}

    .destination-card a {
        text-decoration: none !important;
        color: inherit;
    }

    .destination-card:hover {
        transform: scale(1.02);
    }

    /* --- MODIFICACIÓN: Aumentar la altura para que entre la imagen completa --- */
    .destination-card .image-container {
        /*width: 100%;
        aspect-ratio: 4 / 5;
        height: auto;*/ /* Quitamos el height fijo de 400px */
        /*overflow: hidden;
        border-radius: 8px 8px 0 0;
        background-color: #fff;*/
        width: 100%;
        height: auto; /* Dejamos que la altura la defina la imagen */
        overflow: hidden;
        border-radius: 8px 8px 0 0;
        background-color: #fff;
        display: flex; /* Centrado preventivo */
        align-items: flex-start;
    }

        .destination-card .image-container img {
            width: 100%;
            height: auto;
            display: block;
            /* Cambiamos a 'fill' o 'contain' con fondo blanco */
            object-fit: initial;
        }
    /* --- OVERLAY OBSOLETO: ELIMINADO --- */
    .destination-card .image-overlay {
        display: none;
    }

    /* --- CONTENEDOR DE INFORMACIÓN NUEVO --- */
    .destination-card .destination-info {
        padding: 15px;
        background-color: #fff;
        border-top: 1px solid #eee;
        display: flex;
        flex-direction: column;
        flex-grow: 1;
    }

        .destination-card .destination-info h3 {
            color: #333;
            font-size: 1.3em;
            margin-bottom: 5px;
        }

        /* --- ESTILO DEL PRECIO (NARANJA) --- */
        .destination-card .destination-info .price {
            font-size: 1.5em;
            font-weight: bold;
            color: #D44628; /* NARANJA de tu botón de búsqueda */
            margin-bottom: 10px;
        }

        .destination-card .destination-info .details-text {
            color: #666;
            font-size: 0.9em;
            margin-bottom: 15px;
            flex-grow: 1; /* Empuja el botón hacia abajo si el texto es corto */
        }

/* Agrega esto a tu CSS para los modales */
.modal-body img {
    width: 100%;
    height: auto;
    object-fit: contain; /* Para que no se corte el texto de la foto */
    max-height: 450px;
}


    /* --- BOTÓN DE DETALLES (NARANJA) --- */
    .destination-card .ver-detalles-button {
        text-decoration: none !important;
        display: block;
        /* Color Naranja y estilo como botón de búsqueda */
        background-color: #D44628;
        color: #fff;
        text-align: center;
        padding: 10px;
        border-radius: 4px;
        font-size: 1em;
        transition: background-color 0.2s ease-in-out;
        width: 100%;
        /* Asegura que el botón se mantenga abajo */
        margin-top: auto;
        border: none; /* Asegura que no tenga borde */
    }

        .destination-card .ver-detalles-button:hover {
            background-color: #a52f17; /* Naranja más oscuro al pasar el mouse */
        }


/* --- AJUSTES DE BADGES (Mantenido) --- */
.hot-week-badge,
.discount-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    color: #fff;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 0.8em;
    z-index: 10;
    font-weight: bold;
}

.hot-week-badge {
    background-color: #dc3545;
}

.discount-badge {
    background-color: #ffc107;
    color: #333;
}

.promo-fecha {
    color: #007BFF; /* azul eléctrico */
    font-weight: 600; /* un poco más fuerte */
}