/* ==========================================================================
   Correction du chevauchement et Design Premium
   ========================================================================== */

/* 1. On pousse le conteneur principal sous le header */
#ttr_page #wrapper {
    /* Ajuste le 120px selon la hauteur réelle de ton header */
    padding-top: 140px !important; 
    padding-bottom: 60px !important;
    background-color: #f8fafc !important; /* Fond gris clair pour faire ressortir la carte */
}

/* 2. Style de la "Carte" de contenu */
#content-wrapper {
    max-width: 900px !important;
    margin: 0 auto !important;
    background: #ffffff !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08) !important;
    padding: 3.5rem !important;
    /* On annule les marges négatives ou forcées du thème */
    margin-top: 0 !important; 
}

/* 3. Titre et Typographie */
.page-heading.ttr_page_title {
    text-align: center !important;
    font-size: 2.2rem !important;
    font-weight: 800 !important;
    color: #1a202c !important;
    margin-bottom: 2.5rem !important;
    border: none !important;
}

.page-content.page-cms {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    font-size: 1.05rem !important;
}

/* Force le fond de page complet en blanc ou gris très léger */
#ttr_page, 
#ttr_page #wrapper, 
.ttr_content_and_sidebar_container,
#ttr_content_margin {
    background-color: #f8fafc !important; /* Même couleur de fond partout */
    background-image: none !important;    /* Supprime d'éventuelles textures */
    border: none !important;              /* Supprime les bordures grises */
}

/* Si tu as une ombre ou un contour gris sur le conteneur fluid */
.container-fluid {
    background: transparent !important;
}

/* Responsive : On réduit l'espace sur mobile */
@media (max-width: 768px) {
    #ttr_page #wrapper {
        padding-top: 100px !important;
    }
    #content-wrapper {
        padding: 1.5rem !important;
        margin: 0 15px !important;
    }
}

/* 5. Nettoyage des éléments inutiles de PrestaShop */
#notifications, .clear-both {
    display: none; /* Cache les zones vides si elles polluent le design */
}

/* Responsive : Adaptation mobile */
@media (max-width: 768px) {
    #content-wrapper {
        padding: 1.5rem !important;
        border-radius: 16px !important;
    }
    .ttr_page_title {
        font-size: 1.7rem !important;
    }
}