/**
 * CSS pour la page eficios facture
 * @file eficios_facture.css
 * @author GN
 * @date 03/09/2026
 */


/* ================================
   TABLEAU COMPARATIF EFICIOS
================================ */

.eficios-table-comparatif {
    width: 100%;
    font-family: inherit;
    color: #1f3559;
}


/* STRUCTURE DES LIGNES */

.eficios-table-head,
.eficios-table-row {
    display: grid;
    grid-template-columns: 28% 36% 36%;
}

.eficios-table-row > div {
    min-height: 38px;
    padding: 7px 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-bottom: 1px solid #edf1f5;
    font-size: 14px;
    line-height: 1.35;
}


/* COLONNE LABEL */

.eficios-table-row .eficios-label {
    justify-content: flex-start;
    text-align: left;
    font-weight: 600;
    color: #20385f;
}


/* ================================
   ENTÊTES
================================ */

.eficios-table-head {
    align-items: end;
}

.eficios-col-label {
    min-height: 68px;
}

.eficios-offre {
    min-height: 68px;
    padding: 12px 15px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    color: #ffffff;
    text-align: center;
}

.eficios-offre strong {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.15;
}

.eficios-offre span {
    margin-top: 4px;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 500;
    opacity: 0.92;
}


/* FACTURE */

.eficios-offre-facture {
    background: #14ab71;
    border-radius: 14px 14px 0 0;
}


/* ERP */

.eficios-offre-erp {
    background: #216CA9;
    border-radius: 14px 14px 0 0;
}


/* ================================
   CHECKS / TIRETS
================================ */

.eficios-check {
    color: #13aa71 !important;
    font-size: 20px !important;
    line-height: 1;
    font-weight: 700;
}

.eficios-no {
    color: #b4beca !important;
    font-size: 17px !important;
}


/* ================================
   UTILISATEURS
================================ */

.eficios-users-row {
    margin-top: 8px;
}

.eficios-users-row > div {
    background: #f6f9fc;
    min-height: 48px;
    font-weight: 700;
}


/* ================================
   TARIFS
================================ */

.eficios-price-row > div {
    min-height: 70px;
    border-bottom: 0;
}

.eficios-price {
    display: flex;
    flex-direction: row !important;
    gap: 5px;
    flex-wrap: wrap;
}

.eficios-price strong {
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
}

.eficios-price span {
    font-size: 11px;
    font-weight: 600;
    align-self: flex-end;
    padding-bottom: 3px;
}

.eficios-price small {
    font-size: 12px;
    font-weight: 700;
}


/* PRIX FACTURE */

.eficios-price-facture strong {
    color: #14ab71;
}


/* PRIX ERP */

.eficios-price-erp {
    color: #216CA9;
}

.eficios-price-erp strong {
    color: #216CA9;
}


/* ================================
   PETIT EFFET DE COLONNE
================================ */

.eficios-table-row > div:nth-child(2),
.eficios-table-row > div:nth-child(3) {
    border-left: 1px solid #f0f3f7;
}


/* ================================
   TABLETTE / MOBILE
================================ */

@media screen and (max-width: 980px) {

    .eficios-table-comparatif {
        overflow-x: auto;
        padding-bottom: 5px;
    }

    .eficios-table-head,
    .eficios-table-row {
        min-width: 720px;
    }

}


/* PETIT MOBILE */

@media screen and (max-width: 480px) {

    .eficios-table-head,
    .eficios-table-row {
        grid-template-columns: 220px 250px 250px;
    }

    .eficios-table-row > div {
        font-size: 13px;
    }

}





/* ================================
   ENCART COMPARATIF EFICIOS
================================ */

.eficios-offre-info {
    width: 100%;
    min-height: 450px;
    padding: 45px 25px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    background: #f7faff;
    border: 1px solid #e2eaf3;
    border-radius: 18px;

    text-align: center;
    color: #18345f;

    box-sizing: border-box;
}


/* ICONE INFORMATION */

.eficios-offre-info-icon {
    width: 30px;
    height: 30px;
    margin-bottom: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #216CA9;
    border-radius: 50%;

    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}


/* TITRE */

.eficios-offre-info h3 {
    margin: 0 0 30px 0;
    padding: 0;

    color: #18345f;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.4;

    text-align: center;
}


/* TEXTE */

.eficios-offre-info p {
    margin: 0;
    padding: 0;

    color: #294267;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.65;

    text-align: center;
}


/* ================================
   TABLETTE
================================ */

@media screen and (max-width: 980px) {

    .eficios-offre-info {
        min-height: auto;
        padding: 35px 25px;
    }

    .eficios-offre-info h3 {
        font-size: 21px;
    }

    .eficios-offre-info p {
        font-size: 16px;
    }

}


/* ================================
   MOBILE
================================ */

@media screen and (max-width: 480px) {

    .eficios-offre-info {
        padding: 30px 20px;
        border-radius: 16px;
    }

    .eficios-offre-info-icon {
        margin-bottom: 20px;
    }

    .eficios-offre-info h3 {
        margin-bottom: 20px;
        font-size: 20px;
        line-height: 1.35;
    }

    .eficios-offre-info p {
        font-size: 15px;
        line-height: 1.55;
    }

}

.facture-show-erp {
    background-color: #FB8707 !important;
    color: #ffffff !important;
    border: 1px solid #F3DDAE !important;
    border-radius: 8px !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;

    padding: 10px 16px !important;
    white-space: nowrap;

    transition: all 0.2s ease;
}
.facture-show-erp:hover {
    background-color: #E97800 !important;
    border-color: #E8C985 !important;
    color: #ffffff !important;
}