/* ---- CSS SPÉCIFIQUE À LA FEUILLE A4 (Isolé du reste du site) ---- */
:root {
    --primary-doc: #756054;
    --primary-light-doc: #EFE9E2;
    --accent-doc: #6A7B62;
    --bg-white-doc: #FCFBF9;
    --text-dark-doc: #2C2522;
    --text-muted-doc: #635851;
    --radius-lg-doc: 16px;
}

/* Force l'impression exacte des couleurs (même si l'utilisateur n'a pas coché "Imprimer les arrière-plans") */
* {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
}

@page { 
    size: A4; 
    margin: 0; 
}

/* Zone grise de fond pour faire ressortir la feuille A4 sur l'écran */
.tarifs-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 20px;
    background-color: #E6DED8;
    min-height: 100vh;
}

/* ---- BARRE D'ACTION (ÉCRAN UNIQUEMENT) ---- */
.action-bar {
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
}

.btn-print {
    background-color: var(--accent-doc);
    color: white;
    border: none;
    padding: 12px 25px;
    font-size: 1.1rem;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(106, 123, 98, 0.3);
    transition: all 0.2s ease;
}

.btn-print:hover {
    background-color: #586B52;
    transform: translateY(-2px);
}

/* ---- CONTENEUR DE LA PAGE A4 ---- */
.a4-page {
    width: 210mm;
    min-height: 297mm; /* Hauteur exacte d'un A4 */
    background: var(--bg-white-doc);
    padding: 20mm;
    padding-bottom: 60mm; /* Empêche le texte de toucher le footer du doc */
    position: relative;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    color: var(--text-dark-doc);
    font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    text-align: left;
}

.doc-header {
    text-align: center;
    border-bottom: 2px solid var(--primary-light-doc);
    padding-bottom: 20px;
    margin-bottom: 40px;
}

.doc-header h1 { color: var(--primary-doc); font-size: 2.5rem; margin: 0 0 5px 0; font-weight: 800; }
.doc-header h2 { color: var(--text-muted-doc); font-size: 1.4rem; margin: 0; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; }

.price-section { display: flex; flex-direction: column; gap: 25px; }

.price-card {
    background-color: #FFFFFF;
    border: 1px solid #DCD3CB;
    border-radius: var(--radius-lg-doc);
    padding: 25px 30px;
    position: relative;
    overflow: hidden;
    page-break-inside: avoid; /* Empêche la coupure à l'impression (anciens navigateurs) */
    break-inside: avoid; /* Empêche la coupure à l'impression (nouveaux navigateurs) */
}

.price-card::before {
    content: ''; position: absolute; top: 0; left: 0; width: 6px; height: 100%; background-color: var(--primary-doc);
}

.price-card.highlight::before { background-color: var(--accent-doc); }
.price-card h3 { color: var(--primary-doc); font-size: 1.3rem; margin: 0 0 20px 0; display: flex; align-items: center; gap: 10px; }
.price-card.highlight h3 { color: var(--accent-doc); }

.price-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px dashed #E6DED8; font-size: 1.1rem; }
.price-row:last-of-type { border-bottom: none; padding-bottom: 0; }

.price-name { font-weight: 600; color: var(--text-dark-doc); }
.price-value { font-weight: 800; font-size: 1.25rem; color: var(--primary-doc); background: var(--primary-light-doc); padding: 5px 15px; border-radius: 20px; }
.price-card.highlight .price-value { color: var(--accent-doc); background: #EAF4EA; }

.doc-note {
    background: var(--bg-white-doc); padding: 15px; border-radius: 8px; margin-top: 20px; font-size: 1rem; color: var(--text-muted-doc); border-left: 3px solid var(--accent-doc); line-height: 1.5;
}

.doc-footer {
    position: absolute;
    bottom: 20mm;
    left: 20mm;
    right: 20mm;
    text-align: center;
    border-top: 2px solid var(--primary-light-doc);
    padding-top: 20px;
}

.doc-teaser { font-style: italic; color: var(--primary-doc); font-weight: 600; font-size: 1.05rem; margin-bottom: 15px; }
.doc-contact-info { font-size: 0.85rem; color: var(--text-muted-doc); line-height: 1.4; }

/* Responsive pour que la page s'adapte aux smartphones de manière fluide */
@media (max-width: 800px) {
    .a4-page { 
        width: 100%; 
        min-height: auto; 
        padding: 20px; 
    }
    .doc-footer { 
        position: relative; /* Reprend une place normale sans écraser le contenu */
        left: auto; 
        right: auto; 
        bottom: auto;
        margin-top: 40px; 
    }
    .price-row { 
        flex-direction: column; 
        align-items: flex-start; 
        gap: 10px; 
    }
}

/* ---- COMPORTEMENT MAGIQUE LORS DE L'IMPRESSION / CRÉATION PDF ---- */
@media print { 
    /* On cache l'en-tête noir du site, le pied de page du site et le bouton */
    header, footer, .action-bar { display: none !important; }
    
    /* On réinitialise les marges pour que l'imprimante gère le A4 */
    body, .tarifs-container { padding: 0; background-color: white; display: block; min-height: auto; }
    
    /* On s'assure que la feuille prend exactement 100% du A4 sans les ombres portées */
    .a4-page { box-shadow: none; margin: 0; border: none; width: 210mm; min-height: 297mm; padding: 20mm; padding-bottom: 60mm; }
    
    /* Sur papier, on force le footer à se caler en bas de la page */
    .doc-footer { position: absolute; left: 20mm; right: 20mm; bottom: 20mm; margin-top: 0; }
}