/* =====================================================================
   Cartes produit 2026, communes aux pages de rubrique et de sous-rubrique (préfixe c26- et conteneur .sr26-flux)
   - cartes en tableau de articles/i-sr-tringles-encart.php (encarts, catégories, projectiles)
   - texte sous les images limité, bouton « Voir plus » : global/js/cartes-2026.js
   ===================================================================== */
.sr26-flux { --c26-orange: #c8641e; --c26-orange-d: #a9500f; --c26-txt: #3d3d3d; --c26-txt-l: #7a7268; --c26-ligne: #e3dccf;
    display: flex; flex-wrap: wrap; gap: 14px 12px; align-items: stretch; margin: 0 0 24px; }
.sr26-flux > * { flex: 1 1 100%; }                       /* titres, textes : pleine largeur */
.sr26-flux > br { display: none; }
/* titre de catégorie : <div style="background-color:#e8eae8"><h3><strong><u>…</u></strong></h3><a>(pour plus de détails…)</a></div> */
.sr26-flux div[style*="e8eae8"] { background: none !important; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 18px 0 0; padding: 0 0 8px; border-bottom: 1px solid var(--c26-ligne); }
.sr26-flux div[style*="e8eae8"] h3 { margin: 0; padding: 0; font-size: 20px; font-weight: 600; text-transform: none; text-align: left; color: var(--c26-txt); }
.sr26-flux div[style*="e8eae8"] u, .sr26-flux div[style*="e8eae8"] strong { text-decoration: none; font-weight: 600; }
.sr26-flux div[style*="e8eae8"] > a { font-size: 13px; color: var(--c26-orange-d); }
.sr26-flux > strong { display: block; font-weight: 400; color: #4a443c; }

/* carte : 5 par ligne, puis 4, 3 et 2 sur téléphone */
.sr26-flux table[style*="inline-block"] { flex: 0 0 calc((100% - 48px) / 5); display: block !important; width: auto !important; min-width: 0 !important; margin: 0 !important; background: #fff; border: 1px solid var(--c26-ligne) !important; border-radius: 12px; overflow: hidden; border-collapse: separate; transition: border-color .15s, box-shadow .15s; }
.sr26-flux table[style*="inline-block"]:hover { border-color: var(--c26-orange) !important; box-shadow: 0 10px 26px rgba(60,40,10,.10); }
.sr26-flux table[style*="inline-block"] tbody { display: flex; flex-direction: column; width: 100%; }
.sr26-flux table[style*="inline-block"] tr, .sr26-flux table[style*="inline-block"] td { display: block; width: 100%; }
.sr26-flux table[style*="inline-block"] td { padding: 0 12px; text-align: left; height: auto !important; }
.sr26-flux table[style*="inline-block"] td hr { display: none; }
.sr26-flux table[style*="inline-block"] tr:nth-child(1) { order: 2; }
.sr26-flux table[style*="inline-block"] tr:nth-child(2) { order: 1; }
.sr26-flux table[style*="inline-block"] tr:nth-child(3) { order: 3; }
.sr26-flux table[style*="inline-block"] tr:nth-child(n+4) { order: 4; }
.sr26-flux table[style*="inline-block"] tr:nth-child(1) td { padding-top: 10px; font-size: 14px; font-weight: 600; line-height: 1.35; color: var(--c26-txt); }
.sr26-flux table[style*="inline-block"] tr:nth-child(2) td { padding: 0; background: #fff; }
.sr26-flux table[style*="inline-block"] tr:nth-child(2) a { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; background: #fff; }
.sr26-flux table[style*="inline-block"] tr:nth-child(2) img { width: 100%; height: 100% !important; object-fit: contain; }
/* prix (h5) puis texte d'usage séparé par le script (.c26-desc) */
.sr26-flux table[style*="inline-block"] h5 { margin: 4px 0 4px; font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--c26-txt); text-transform: none; text-align: left; }
.sr26-flux table[style*="inline-block"] strike { color: var(--c26-txt-l); font-weight: 400; }
.sr26-flux table[style*="inline-block"] form { margin: 0 0 6px; }
.sr26-flux table[style*="inline-block"] td > .c26-desc { margin: 0 0 12px; }
.sr26-flux table.sr26-carte-lien { cursor: pointer; }

/* texte sous les images : limité à 90 caractères + « Voir plus » */
.c26-desc { display: block; font-size: 13px; font-weight: 400; line-height: 1.45; color: var(--c26-txt-l, #7a7268); text-align: left; }
.c26-voirplus { display: inline; margin: 0 0 0 4px; padding: 0; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--c26-orange-d, #a9500f); text-decoration: underline; cursor: pointer; white-space: nowrap; }
.c26-voirplus:hover { color: var(--c26-orange, #c8641e); }

@media (max-width: 1100px) { .sr26-flux table[style*="inline-block"] { flex-basis: calc((100% - 36px) / 4); } }
@media (max-width: 900px)  { .sr26-flux table[style*="inline-block"] { flex-basis: calc((100% - 24px) / 3); } }
@media (max-width: 600px)  {
    .sr26-flux { gap: 10px 8px; }
    .sr26-flux table[style*="inline-block"] { flex-basis: calc((100% - 8px) / 2); }
    .sr26-flux table[style*="inline-block"] td { padding: 0 9px; }
    .sr26-flux table[style*="inline-block"] tr:nth-child(1) td { font-size: 13px; }
}

/* Tableaux d'images saisis dans les textes de rubrique / sous-rubrique (class="table_rd") : 2 colonnes sur téléphone
   (rd.css les empilait sur une seule colonne) */
@media (max-width: 600px) {
    .rb26-texte table.table_rd, .sr26-texte table.table_rd { display: block; width: 100%; }
    .rb26-texte table.table_rd tbody, .sr26-texte table.table_rd tbody { display: block; width: 100%; }
    .rb26-texte table.table_rd tr, .sr26-texte table.table_rd tr { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; margin: 0 0 10px; }
    .rb26-texte table.table_rd td, .sr26-texte table.table_rd td { display: block !important; width: auto !important; padding: 0 !important; }
    .rb26-texte table.table_rd img, .sr26-texte table.table_rd img { width: 100%; height: auto; }
}
