/* ==================================================
   CSMT - Override couleurs
   Remplace jaune / doré par rouge
   ================================================== */

:root{
    --csmt-red:#E31B23;
    --csmt-red-2:#ff2b38;

    /* si le thème d'origine utilise des variables */
    --gold:var(--csmt-red) !important;
    --gold2:var(--csmt-red-2) !important;
    --accent:var(--csmt-red) !important;
    --accent2:var(--csmt-red-2) !important;
    --w49-gold:var(--csmt-red) !important;
    --w49-gold2:var(--csmt-red-2) !important;
}

/* ===== HERO ===== */
.w49-copy h1 span,
.w49-copy .k,
.w49-copy .k *{
    color:var(--csmt-red) !important;
}

/* petit trait du hero */
.w49-copy .k::before,
.w49-copy .k::after,
.w49-copy .line,
.w49-copy .line::before,
.w49-copy .line::after{
    background:var(--csmt-red) !important;
    border-color:var(--csmt-red) !important;
}

/* ===== Textes dorés / jaunes ===== */
.eyebrow,
.tag,
.badge,
.section-label,
.kicker,
.accent,
[class*="gold"],
[class*="accent"],
.w49-section-tag,
.w49-newsroom-tag,
.w49-store-tag,
.w49-youth-tag,
.w49-archive-tag{
    color:var(--csmt-red) !important;
}

/* ===== Nombres 01 / 02 et gros accents ===== */
.w49-youth-grid strong,
.w49-youth-grid b,
.w49-youth-grid .num,
.w49-youth-grid .number,
.w49-future strong,
.w49-future b,
.w49-future .num,
.w49-future .number{
    color:var(--csmt-red) !important;
}

/* ===== Icônes / bordures dorées ===== */
.w49-links .icon,
.w49-service-icon,
.w49-card-icon,
.w49-feature-icon,
.w49-chip,
.w49-pill,
.w49-badge{
    color:var(--csmt-red) !important;
    border-color:rgba(227,27,35,.55) !important;
}

/* ===== Boutons / petits liens accent ===== */
.button.outline,
.btn-outline,
a.outline{
    color:var(--csmt-red) !important;
    border-color:var(--csmt-red) !important;
}

.button.outline:hover,
.btn-outline:hover,
a.outline:hover{
    background:var(--csmt-red) !important;
    color:#fff !important;
}

/* ===== traits / séparateurs dorés ===== */
hr,
.section-divider,
.w49-divider{
    border-color:rgba(227,27,35,.45) !important;
}

/* ===== si certaines cartes utilisent du doré ===== */
.w49-card small,
.w49-card .meta,
.w49-panel small,
.w49-panel .meta{
    color:var(--csmt-red) !important;
}

/* ===== Icônes des blocs accueil en rouge ===== */

.card i,
.card svg,
.panel i,
.panel svg,
[class*="icon"] i,
[class*="icon"] svg,
[class*="feature"] i,
[class*="feature"] svg,
[class*="service"] i,
[class*="service"] svg {
    color: #E31B23 !important;
    fill: #E31B23 !important;
    stroke: #E31B23 !important;
}

/* cercle / cadre autour des icônes */
.card [class*="icon"],
.panel [class*="icon"],
[class*="feature"] [class*="icon"],
[class*="service"] [class*="icon"] {
    border-color: rgba(227,27,35,.45) !important;
    color: #E31B23 !important;
}

/* si l’icône est dans un petit badge/cercle */
.card [class*="icon"] *,
.panel [class*="icon"] * {
    color: #E31B23 !important;
    fill: #E31B23 !important;
    stroke: #E31B23 !important;
}


/* Finition icônes accueil */
[class*="icon"],
.w49-card-icon,
.w49-service-icon,
.w49-feature-icon {
    background:#fff !important;
    border:1px solid rgba(227,27,35,.35) !important;
    box-shadow:0 4px 12px rgba(0,0,0,.05);
}

[class*="icon"] svg,
[class*="icon"] i,
.w49-card-icon svg,
.w49-service-icon svg,
.w49-feature-icon svg {
    color:#E31B23 !important;
    fill:#E31B23 !important;
    stroke:#E31B23 !important;
}

/* ===== Grand titre : même police que ES Guelma ===== */
.w49-copy h1,
.w49-copy h1 span,
.w49-copy .k,
.w49-copy p {
    font-family: "Cairo","Tajawal","Segoe UI",Tahoma,Arial,sans-serif !important;
}

.w49-copy h1 {
    font-size: clamp(56px,6.6vw,104px) !important;
    line-height: .94 !important;
    font-weight: 950 !important;
    letter-spacing: -.05em !important;
    color: #ffffff !important;
}

.w49-copy h1 span {
    display:block !important;
    color:#E31B23 !important;
    font-weight:950 !important;
}


/* ===== Réseaux sociaux CSM Touggourt ===== */
.csmt-socials{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    flex-wrap:wrap;
    margin-top:18px;
}

.csmt-socials a{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border:1px solid rgba(227,27,35,.55);
    border-radius:50%;
    background:#0b0b0b;
    color:#fff !important;
    font-size:18px;
    text-decoration:none;
    transition:.2s ease;
}

.csmt-socials a:hover{
    background:#E31B23;
    border-color:#E31B23;
    color:#fff !important;
    transform:translateY(-2px);
}
