/*
 * Strasselec — Forçage couleur noire pour le contenu CMS et produits
 * Appliqué automatiquement via theme.yml sur les pages cms et product
 * Utilise !important pour écraser les couleurs inline du TinyMCE
 */

/* ── Pages CMS ───────────────────────────────────────────────────── */
body.page-cms .page-content,
body.page-cms .page-content p,
body.page-cms .page-content h1,
body.page-cms .page-content h2,
body.page-cms .page-content h3,
body.page-cms .page-content h4,
body.page-cms .page-content h5,
body.page-cms .page-content h6,
body.page-cms .page-content li,
body.page-cms .page-content td,
body.page-cms .page-content th,
body.page-cms .page-content span,
body.page-cms .page-content div,
body.page-cms .page-content strong,
body.page-cms .page-content em,
body.page-cms .page-content label {
    color: #000000 !important;
}

/* ── Pages Produit ───────────────────────────────────────────────── */
body.page-product .product-description,
body.page-product .product-description p,
body.page-product .product-description h1,
body.page-product .product-description h2,
body.page-product .product-description h3,
body.page-product .product-description h4,
body.page-product .product-description h5,
body.page-product .product-description h6,
body.page-product .product-description li,
body.page-product .product-description td,
body.page-product .product-description th,
body.page-product .product-description span,
body.page-product .product-description div,
body.page-product .product-description strong,
body.page-product .product-description em,
body.page-product .product-description label,
body.page-product .product-description-short,
body.page-product .product-description-short p,
body.page-product .product-description-short span,
body.page-product .product-description-short div,
body.page-product .product-description-short strong,
body.page-product .product-description-short em {
    color: #000000 !important;
}

/* ── Listes : <p> dans <li> → inline pour garder le texte collé au rond ── */
body.page-cms .page-content ul,
body.page-cms .page-content ol {
    padding-left: 1.6em;
    margin: .6em 0;
}
body.page-cms .page-content li {
    display: list-item !important;
    list-style-position: outside;
    margin-bottom: .35em;
    line-height: 1.55;
}
body.page-cms .page-content li > p,
body.page-cms .page-content li > span {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page-product .product-description ul,
body.page-product .product-description ol,
body.page-product .product-description-short ul,
body.page-product .product-description-short ol {
    padding-left: 1.6em;
    margin: .6em 0;
}
body.page-product .product-description li,
body.page-product .product-description-short li {
    display: list-item !important;
    list-style-position: outside;
    margin-bottom: .35em;
    line-height: 1.55;
}
body.page-product .product-description li > p,
body.page-product .product-description li > span,
body.page-product .product-description-short li > p,
body.page-product .product-description-short li > span {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ── Badges de réassurance ───────────────────────────────────────── */
.str-reassurance {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0;
    background: #f0f4ff;
    border-top: 3px solid #1e40af;
    border-bottom: 3px solid #1e40af;
    padding: 0;
    margin: 0;
    width: 100%;
}

.str-reassurance__item {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 1 220px;
    padding: 18px 24px;
    border-right: 1px solid #c7d5f5;
    min-width: 200px;
}

.str-reassurance__item:last-child {
    border-right: none;
}

.str-reassurance__icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    background: #1e40af;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.str-reassurance__icon .material-icons {
    color: #fff;
    font-size: 1.4rem;
}

.str-reassurance__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.str-reassurance__title {
    font-size: 0.92rem;
    font-weight: 700;
    color: #1e3a8a;
    line-height: 1.3;
    margin: 0;
}

.str-reassurance__sub {
    font-size: 0.8rem;
    color: #555;
    line-height: 1.3;
    margin: 0;
}

/* Version compacte sur fiche produit */
.str-reassurance--product {
    background: #fff;
    border: 1px solid #c7d5f5;
    border-radius: 6px;
    margin-top: 16px;
    margin-bottom: 8px;
    border-top: 3px solid #1e40af;
    border-bottom: 1px solid #c7d5f5;
}

.str-reassurance--product .str-reassurance__item {
    padding: 12px 16px;
    border-right: 1px solid #e8edf8;
}

.str-reassurance--product .str-reassurance__icon {
    width: 36px;
    height: 36px;
}

.str-reassurance--product .str-reassurance__icon .material-icons {
    font-size: 1.1rem;
}

/* Responsive */
@media (max-width: 767px) {
    .str-reassurance__item {
        flex: 1 1 calc(50% - 1px);
        border-right: 1px solid #c7d5f5;
        border-bottom: 1px solid #c7d5f5;
        padding: 14px 16px;
        min-width: 0;
    }
    .str-reassurance__item:nth-child(2n) {
        border-right: none;
    }
    .str-reassurance__item:last-child,
    .str-reassurance__item:nth-last-child(2):nth-child(odd) {
        border-bottom: none;
    }
}

@media (max-width: 400px) {
    .str-reassurance__item {
        flex: 1 1 100%;
        border-right: none;
    }
    .str-reassurance__item:last-child {
        border-bottom: none;
    }
}

/* ── Avis important page magasins ──────────────────── */
.store-notice {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin: 0;
    padding: 1.1rem 1.4rem;
    background: #eff6ff;
    border-top: 3px solid #1e40af;
    border-left: 4px solid #1e40af;
}

.store-notice__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    padding: 0.1rem 0;
    flex-shrink: 0;
}

.store-notice__icon-wrap .material-icons {
    color: #1e3a8a;
    font-size: 2rem;
}

.store-notice__body {
    flex: 1;
}

.store-notice__line1 {
    margin: 0 0 0.5rem 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1e3a8a;
    line-height: 1.5;
}

.store-notice__line2 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
    color: #1e3a8a;
    line-height: 1.4;
    letter-spacing: 0.01em;
}

/* Contacts toujours visibles */
.store-contact-list {
    list-style: none;
    padding: 0;
    margin: 0.75rem 0 0 0;
}

.store-contact-list li {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.3rem;
    font-size: 0.93rem;
    color: #333;
}

.store-contact-list .material-icons {
    font-size: 1.1rem;
    color: #b91c1c;
}