/*
    Template:       mantis
    Theme Name:     Mantis Child
    Theme URI:      http://themeforest.net/user/LA-Studio/portfolio?ref=LA-Studio
    Author:         LA Studio
    Author URI:     http://themeforest.net/user/LA-Studio?ref=LA-Studio
    Description:    Mantis - Minimal & Modern WooCommerce Theme
    Version:        1.0
    Tags:           one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, full-width-template, post-formats, sticky-post, theme-options, translation-ready
    License: 		    GNU General Public License
	  License URI: 	  licence/GPL.txt
    Text Domain:    mantis-child
    Domain Path:    /languages/
*/
/* =====================================================
   FIX PLACEHOLDER CAMPO DATA - SOLUZIONE COMPLETA
   ===================================================== */
/* =====================================================
   FIX ALTEZZA IMMAGINI ZONE - CONTACT FORM 7
   ===================================================== */

/* Container delle zone nel form */
.wpcf7 .zone-preview,
.form-box .zone-preview {
    margin: 30px 0;
    padding: 20px 0;
}

/* Titolo Zone Prenotazione */
.wpcf7 .zone-preview h3,
.form-box .zone-preview h3 {
    text-align: center;
    color: #CAB16F;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 30px;
    font-size: 18px;
}

/* Container delle immagini */
.wpcf7 .zone-images,
.form-box .zone-images {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}

/* Singolo item zona */
.wpcf7 .zone-item,
.form-box .zone-item {
    flex: 1;
    min-width: 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* IMPORTANTE: Fix altezza immagini */
.wpcf7 .zone-item img,
.form-box .zone-item img {
    width: 100% !important;
    height: 200px !important; /* Altezza fissa per tutte */
    object-fit: cover !important; /* Riempie il contenitore mantenendo proporzioni */
    border-radius: 8px;
    margin-bottom: 10px;
    display: block;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Opzione alternativa per l'immagine del dehors con logo */
/* Se vuoi che il logo rimanga intero senza essere tagliato */
.wpcf7 .zone-item:last-child img,
.form-box .zone-item:nth-child(3) img {
    object-fit: contain !important; /* Mostra l'immagine intera */
    background-color: #fff; /* Sfondo bianco per riempire lo spazio */
    padding: 10px;
}

/* Nome della zona sotto l'immagine */
.wpcf7 .zone-item span,
.form-box .zone-item span {
    display: block;
    margin-top: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #CAB16F;
    font-size: 14px;
}

/* Effetto hover sulle immagini */
.wpcf7 .zone-item:hover img,
.form-box .zone-item:hover img {
    transform: translateY(-3px);
    box-shadow: 0 5px 20px rgba(0,0,0,0.2);
}

/* Responsive - Tablet */
@media screen and (max-width: 991px) {
    .wpcf7 .zone-item img,
    .form-box .zone-item img {
        height: 180px !important;
    }
    
    .wpcf7 .zone-images,
    .form-box .zone-images {
        gap: 15px;
    }
}

/* Responsive - Mobile */
@media screen and (max-width: 767px) {
    /* Su mobile le immagini vanno in colonna */
    .wpcf7 .zone-images,
    .form-box .zone-images {
        flex-direction: column;
        gap: 20px;
    }
    
    .wpcf7 .zone-item,
    .form-box .zone-item {
        width: 100%;
        min-width: 100%;
    }
    
    .wpcf7 .zone-item img,
    .form-box .zone-item img {
        height: 220px !important;
        width: 100% !important;
    }
    
    .wpcf7 .zone-preview h3,
    .form-box .zone-preview h3 {
        font-size: 16px;
    }
}

/* Stile alternativo con bordi */
.wpcf7 .zone-item img.bordered,
.form-box .zone-item img.bordered {
    border: 2px solid #CAB16F;
    padding: 5px;
    background: #fff;
}

/* Fix per assicurarsi che tutte le immagini abbiano la stessa altezza */
.zone-preview .zone-images img {
    height: 200px !important;
    width: 100% !important;
    object-fit: cover !important;
}

/* Se vuoi mantenere il logo dehors visibile per intero */
.zone-preview .zone-images .zone-item:nth-child(3) img[src*="ORIENTAL"] {
    object-fit: contain !important;
    background: white;
    padding: 15px;
}

/* Allineamento uniforme dei nomi delle zone */
.zone-preview .zone-images .zone-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}