/* ============================================================
   FR Cards – Styles
   ============================================================ */

.frcw-wrapper {
    width: 100%;
    max-width: 860px;
}

.frcw-wrapper *, .frcw-wrapper *::before, .frcw-wrapper *::after {
    box-sizing: border-box;
}

/* ── Grille ── */
.frcw-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 395px));
    gap: 24px;
    justify-content: start;
}

/* ── Card ──
   Les --fr-* sont déclarées sur .frcw-card (et non :root) pour que
   le style="" inline Elementor puisse les écraser card par card.
── */
.frcw-card {
    --frcw-card-bg:                #1D242C;
    --frcw-card-border:            #252a35;
    --fr-color-label:            #7fff6e;
    --fr-color-title:            #e8eaf0;
    --fr-color-including-header: #e8eaf0;
    --fr-color-including-items:  #e8eaf0;
    --fr-color-price:            #7fff6e;
    --fr-color-desc:             #e8eaf0;
    --fr-color-learn:            #e8eaf0;
    --muted:                     #7a8099;

    background:   var(--frcw-card-bg)           ;
    border:       1px solid var(--frcw-card-border) ;
    padding:      10px                        ;
    display:      flex                        ;
    flex-direction: column                    ;
    gap:          24px                        ;
    min-width:    0                           ;
}

/* ── Image ── */
.frcw-card-image {
    overflow:        hidden        ;
    align-self:      stretch       ;
    display:         flex          ;
    align-items:     center        ;
    justify-content: center        ;
    flex-shrink:     0             ;
}

.frcw-card-image img {
    width:            100%         ;
    object-fit:       contain      ;
    object-position:  center       ;
    display:          block        ;
    height: 230px !important;
}

/* ── Contenu ── */
.frcw-card-content {
    display:        flex          ;
    flex-direction: column        ;
    flex:           1             ;
    min-width:      0             ;
}

/* ── Label ── */
.frcw-card-label {
    font-family:     inherit;
    font-size:       16px;
    font-weight:     500          ;
    letter-spacing:  0.08em       ;
    color:           var(--fr-color-label);
    line-height:     1;
}

/* ── Titre ── */
.frcw-card-title {
    font-family:  inherit;
    font-size:    22px;
    font-weight:  500             ;
    color:        var(--fr-color-title);
    line-height:  1.1;
    margin:       0               ;
    padding-top:  4px             ;
}

/* ── Including header (sous-ligné) ── */
.frcw-card-including-header {
    font-family:     inherit;
    font-size:       13px;
    font-weight:     700          ;
    color:           var(--fr-color-including-header);
    letter-spacing:  0.06em       ;
    margin-bottom:   4px          ;
    padding-bottom:  3px          ;
    border-bottom:   1px solid var(--fr-color-including-header) ;
    display:         inline-block ;
    background:      none         ;
}

/* ── Including liste ── */
.frcw-card-including {
    display:        flex          ;
    flex-direction: column        ;
}

.frcw-card-including-item {
    font-family:  inherit;
    font-size:    13px;
    line-height:  1.4;
}

.frcw-card-including-item.active {
    color:       var(--fr-color-including-items);
    font-weight: 500              ;
}

.frcw-card-including-item.muted {
    color: var(--muted);
}

/* ── Learn more ── */
.frcw-card-learn {
    font-family:     inherit;
    font-size:       13px;
    color:           var(--fr-color-learn);
    cursor:          pointer      ;
    background:      none         ;
    border:          none         ;
    border-bottom:   1px solid var(--frcw-card-border) ;
    padding:         0 0 2px 0   ;
    text-align:      left         ;
    margin-top:      8px          ;
    text-decoration: none         ;
    display:         inline-block ;
}

/* ── Footer ── */
.frcw-card-footer {
    display:        flex          ;
    flex-direction: column        ;
    justify-content:space-between ;
    margin-top:     auto          ;
}

.frcw-card-footer-first-block {
    display:         flex         ;
    justify-content: space-between ;
}

/* ── Prix ── */
.frcw-card-price {
    font-family:  inherit;
    font-size:    18px;
    font-weight:  500             ;
    color:        var(--fr-color-price);
    text-align:   right           ;
}

/* ── Bouton panier ── */
.frcw-btn-cart {
    font-family:   inherit;
    background:    black          ;
    border:        0              ;
    font-size:     16px;
    color:         white;
    padding:       2px 8px        ;
    border-radius: 24px           ;
    cursor:        pointer        ;
    transition:    background 0.15s, transform 0.1s ;
}

.frcw-btn-cart:hover  { background: #fff ; color: #000; transform: scale(1.04); }
.frcw-btn-cart:active { transform: scale(0.97); }

/* ── Description courte (mobile) ── */
.frcw-card-desc {
    display:     none             ;
    font-family: inherit;
    font-size:   12px;
    color:       var(--fr-color-desc);
    line-height: 1.5;
    margin:      4px 0 0 0        ;
}

/* ── font-family : propagée depuis .frcw-wrapper via inherit ──
   Le sélecteur Elementor écrit sur .frcw-wrapper, tous les enfants
   héritent grâce aux font-family: inherit ci-dessus.
── */
.frcw-wrapper {
    width:      100%;
    max-width:  860px;
    font-family: 'Helvetica Neue', sans-serif;
}

/* ── Responsive ── */
@media (min-width: 767px) {
    .frcw-card {
        flex-direction: row  ;
        gap:            16px ;
    }
    .frcw-card-image {
        width:     51%  ;
        min-width: 45%  ;
        align-self:stretch ;
    }
    .frcw-card-footer-first-block {
        flex-direction:  column       ;
        justify-content: space-between ;
    }
}

@media (max-width: 600px) {
    .frcw-card                  { gap: 8px ; }
    .frcw-card-label            { display: none ; }
    .frcw-card-title            { font-size: 18px; }
    .frcw-card-including,
    .frcw-card-including-header { display: none ; }
    .frcw-card-desc             { display: block ; }
    .frcw-btn-cart              { padding: 4px 10px ; font-size: 12px; }
    .frcw-card-price            { font-size: 15px; }
    .frcw-card-footer-first-block {
        flex-direction:  row ;
        align-items:     center ;
        justify-content: space-between ;
    }
}
