/*
 * LaMortaise.com : styles des blocs « Membres » et « Statistiques » de l'index du forum.
 * Charge automatiquement par KBee (templates/yootheme/css/nts_kbee_custom.css).
 * Ajoute le 2026-11-03, remanie le 2026-11-03 (fond commun, liste des membres sobre).
 */

/* --- Structure commune : le contenu prend toute la largeur --- */
#kunena.layout #kwho .krow,
#kunena.layout #kstats .krow {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    background: #F2F1EE;
}

#kunena.layout #kwho .kcol,
#kunena.layout #kstats .kcol {
    background: transparent;
}

#kunena.layout #kwho .kcol-icon,
#kunena.layout #kstats .kcol-icon {
    flex: 0 0 auto;
}

#kunena.layout #kwho .kcol-auto,
#kunena.layout #kstats .kcol-auto {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    width: auto;
    display: block;
    padding: 14px 18px;
}

#kunena.layout #kwho .ksection-header h2,
#kunena.layout #kwho .ksection-header h2 a {
    color: #fff;
}

/* --- Cartes et cases (communes aux deux blocs) --- */
#kunena.layout .kwho-tile,
#kunena.layout .kwho-card,
#kunena.layout .kstat-big > div,
#kunena.layout .kstat-card {
    background: #fff;
    border: 1px solid #d5d5d5;
    border-radius: 3px;
}

#kunena.layout .kwho-card h3,
#kunena.layout .kstat-card h3 {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #4A7295;
    margin: 0 0 6px;
    padding: 0 0 5px;
    border-bottom: 1px solid #e5e5e5;
}

/* --- Membres --- */
#kunena.layout #kwho .kwho-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 0 0 12px;
}

#kunena.layout #kwho .kwho-tile {
    padding: 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#kunena.layout #kwho .kwho-tile strong {
    display: block;
    font-size: 30px;
    line-height: 1.15;
    color: #5388B4;
}

#kunena.layout #kwho .kwho-tile span {
    font-size: 12px;
    color: #777;
    text-transform: uppercase;
    letter-spacing: .04em;
}

#kunena.layout #kwho .kwho-card {
    padding: 10px 14px;
}

#kunena.layout #kwho .kwho-legend-items {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px 10px;
    font-size: 12px;
    line-height: 1.6;
}

#kunena.layout #kwho .kwho-legend-items span,
#kunena.layout #kwho .kwho-legend-items a {
    display: inline;
    white-space: nowrap;
}

#kunena.layout #kwho .kwho-legend-items i {
    margin-right: 4px;
}

/* Liste « En ligne maintenant » : texte simple, un point entre les pseudos */
#kunena.layout #kwho .kwho-names > div {
    font-size: 0;
    line-height: 1.9;
}

#kunena.layout #kwho .kwho-names > div > span,
#kunena.layout #kwho .kwho-names > div > a {
    display: inline;
    white-space: nowrap;
    font-size: 15px;
    font-weight: 600;
}

#kunena.layout #kwho .kwho-names > div > span:not(:last-child)::after,
#kunena.layout #kwho .kwho-names > div > a:not(:last-child)::after {
    content: "\00b7";
    margin: 0 10px;
    color: #bbb;
    font-weight: 400;
}

/* « Utilisateurs cachés » (administrateurs seulement) */
#kunena.layout #kwho .kwho-names > div + div {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #e5e5e5;
}

#kunena.layout #kwho .kwho-names > div + div > span:first-child {
    font-size: 13px;
    font-weight: 400;
    color: #777;
    margin-right: 8px;
}

#kunena.layout #kwho .kwho-names > div + div > span:first-child::after {
    content: none;
}

/* --- Statistiques --- */
#kunena.layout #kstats .kstat-big {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 0 0 12px;
}

#kunena.layout #kstats .kstat-big > div {
    padding: 12px;
    text-align: center;
}

#kunena.layout #kstats .kstat-big strong {
    display: block;
    font-size: 30px;
    line-height: 1.15;
    color: #5388B4;
}

#kunena.layout #kstats .kstat-big span {
    font-size: 12px;
    color: #777;
    text-transform: uppercase;
    letter-spacing: .04em;
}

#kunena.layout #kstats .kstat-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 0 0 12px;
}

#kunena.layout #kstats .kstat-card {
    padding: 10px 14px;
}

#kunena.layout #kstats .kstat-card p {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
    color: #555;
}

#kunena.layout #kstats .kstat-card p strong {
    color: #222;
}

#kunena.layout #kstats .kstat-last {
    font-size: 13px;
    color: #555;
}

/* --- Telephone --- */
@media (max-width: 700px) {
    #kunena.layout #kwho .kcol-auto,
    #kunena.layout #kstats .kcol-auto {
        padding: 10px 12px;
    }

    #kunena.layout #kwho .kwho-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    #kunena.layout #kwho .kwho-legend {
        grid-column: 1 / -1;
    }

    #kunena.layout #kwho .kwho-tile strong,
    #kunena.layout #kstats .kstat-big strong {
        font-size: 20px;
    }

    #kunena.layout #kstats .kstat-big {
        gap: 6px;
    }

    #kunena.layout #kstats .kstat-cards {
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

/* =====================================================================
 * LaMortaise.com : index du forum, mise en forme « bandeaux bleus modernises »
 * Prepare le 2026-11-03 (essais visuels valides par David : essai n° 3).
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css
 * (jamais dans media/kunena/core/css/custom.css : cache de 7 jours).
 * Ne change ni les sections, ni leurs noms, ni leur ordre : apparence seulement.
 * Couleurs : bleu #5388B4, bleu fonce #4A7295 / #2F5B7C, beige #F2F1EE, filets #E4E1DB.
 * Retour en arriere : supprimer ce bloc (de ce commentaire jusqu'au suivant « FIN »).
 * ===================================================================== */

/* --- Cartes de groupe (un groupe = un bloc avec bandeau bleu) --- */
#kunena.layout .kfrontend.ksection {
    border: 1px solid #d5d5d5;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 18px;
    background: #fff;
    box-shadow: none;
}

#kunena.layout .ksection-header {
    background: #5388B4;
    border: 0;
    padding: 9px 14px;
}

#kunena.layout .ksection-header h2,
#kunena.layout .ksection-header h2 a {
    font-family: Kreon, Georgia, serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .4px;
    color: #fff;
    margin: 0;
}

#kunena.layout .ksection .ksection-header .ksection-count {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    border-radius: 999px;
    padding: 1px 9px;
    font-size: 12px;
    font-weight: 700;
    margin-left: 8px;
}

#kunena.layout .ksection-toggle button {
    color: #fff;
    background: transparent;
    border: 0;
}

/* --- Lignes de sections : serrees, une sur deux en beige tres pale --- */
#kunena.layout .krow.category {
    border-top: 1px solid #E4E1DB;
    padding: 9px 14px;
    background: #fff;
}

#kunena.layout .kcat-list .krow.category:first-child {
    border-top: 0;
}

#kunena.layout .kcat-list .krow.category:nth-child(even) {
    background: #F2F1EE;
}

#kunena.layout .kcat-list .krow.category:hover {
    background: #E8EDF2;
}

#kunena.layout .krow.category h3,
#kunena.layout .krow.category h3 a {
    font-family: Kreon, Georgia, serif;
    font-weight: 700;
    font-size: 16px;
    color: #2F5B7C;
    text-transform: none;
    text-decoration: none;
    margin: 0;
}

#kunena.layout .krow.category .kcat-desc {
    font-size: 13.5px;
    line-height: 1.35;
    color: #45484B;
    margin-top: 2px;
}

#kunena.layout .krow.category .kcol-icon i {
    color: #5388B4;
    font-size: 1.8em;
}

#kunena.layout .krow.category .kstats-value {
    font-family: Kreon, Georgia, serif;
    font-weight: 700;
    color: #4A7295;
    font-size: 15px;
}

#kunena.layout .krow.category .kstats-label {
    color: #5B5A57;
    font-size: 12px;
}

#kunena.layout .krow.category .kcol-latest-post {
    border-left: 2px solid #E4E1DB;
    padding-left: 10px;
    font-size: 13px;
    color: #5B5A57;
}

#kunena.layout .krow.category .klast-post-link a {
    font-weight: 700;
    color: #2F5B7C;
}

/* --- Telephone (a verifier avec David avant publication) --- */
@media (max-width: 700px) {
    #kunena.layout .krow.category {
        padding: 8px 10px;
    }

    #kunena.layout .ksection-header h2,
    #kunena.layout .ksection-header h2 a {
        font-size: 16px;
    }
}

/* Correctif 2026-11-04 : blocs « Membres » et « Statistiques » (classe ksection sans kfrontend) : memes coins arrondis que les groupes */
#kunena.layout #kwho.ksection,
#kunena.layout #kstats.ksection {
    border: 1px solid #d5d5d5;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 18px;
    box-shadow: none;
}
/* ===== FIN : index du forum, bandeaux bleus modernises ===== */

/* =====================================================================
 * LaMortaise.com : pages de section et de sujet du forum
 * Prepare le 2026-11-04 (essais visuels dans le navigateur, valides par David).
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * APRES le bloc « index du forum » (meme palette).
 * Apparence seulement : aucune section, aucun message n'est modifie.
 * Retour en arriere : supprimer ce bloc (de ce commentaire jusqu'a « FIN section et sujet »).
 * Remarque : le fichier media/kunena/core/css/custom.css (janvier 2026) demande la police
 * « Montserrat », qui n'est pas chargee sur le site ; ce bloc la remplace sans modifier ce fichier.
 * ===================================================================== */

/* --- Page d'un sujet : cartes de messages --- */
#kunena.layout .kmessage {
    border: 1px solid #d5d5d5;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
    background: #fff;
}

#kunena.layout .kmessage-profile-left {
    background: #F2F1EE;
    border-right: 1px solid #E4E1DB;
}

/* Texte du message : police du site, plus lisible */
#kunena.layout .kunena-topic-item .kmessage .kmsg-body {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 16px;
    line-height: 1.65;
    color: #26292C;
}

#kunena.layout .kmsg-header {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 13px;
    color: #5B5A57;
    border-bottom: 1px solid #E4E1DB;
    padding-bottom: 8px;
    margin-bottom: 12px;
}

#kunena.layout .kmsg-title h4 {
    font-family: Kreon, Georgia, serif;
    font-size: 20px;
    font-weight: 700;
    color: #2F5B7C;
    text-transform: none;
    letter-spacing: 0;
    margin: 0 0 4px;
}

#kunena.layout .kuser-name,
#kunena.layout .kuser-name a {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-weight: 700;
}

/* Titre de la page (sujet ou section) : sans majuscules */
#kunena.layout h1,
#kunena.layout h2.kheader,
#kunena.layout .ktopic-title {
    font-family: Kreon, Georgia, serif;
    text-transform: none;
}

/* --- Page d'une section : liste des sujets --- */
#kunena.layout .ktopic-list-wrap {
    border: 1px solid #d5d5d5;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    margin-bottom: 18px;
}

#kunena.layout .ktopic-list-header {
    background: #5388B4;
}

#kunena.layout .ktopic-list-header .krow {
    padding: 6px 14px;
}

#kunena.layout .ktopic-list-header a,
#kunena.layout .ktopic-list-header i {
    color: #fff;
}

#kunena.layout .ktopic-list .krow {
    border-top: 1px solid #E4E1DB;
    padding: 9px 14px;
    background: #fff;
}

#kunena.layout .ktopic-list .krow:nth-child(even) {
    background: #F2F1EE;
}

/* Sujets epingles ou verrouilles : fond jaune pale conserve */
#kunena.layout .ktopic-list .krow.category-stickymsg {
    background: #FFF7E0;
}

#kunena.layout .ktopic-list .krow:hover {
    background: #E8EDF2;
}

#kunena.layout .ktopic-title-wrap h3,
#kunena.layout .ktopic-title-wrap h3 a,
#kunena.layout .ktopic-title-wrap h3 a.topictitle {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #2F5B7C;
    text-transform: none;
    letter-spacing: 0;
    margin: 0;
}

#kunena.layout .ktopic-meta {
    font-size: 13px;
    color: #5B5A57;
    margin-top: 2px;
}

#kunena.layout .ktopic-list .kstats-value {
    font-family: Kreon, Georgia, serif;
    font-weight: 700;
    color: #4A7295;
    font-size: 15px;
}

#kunena.layout .ktopic-list .kstats-label {
    font-size: 12px;
    color: #5B5A57;
}

#kunena.layout .ktopic-list .kcol-latest-post {
    border-left: 2px solid #E4E1DB;
    padding-left: 10px;
    font-size: 13px;
}

/* Espaceur entre sujets epingles et sujets normaux : reduit */
#kunena.layout .kcontenttablespacer {
    height: 8px;
    padding: 0;
    border: 0;
}

/* --- Telephone (a verifier avec David avant publication) --- */
@media (max-width: 700px) {
    #kunena.layout .kunena-topic-item .kmessage .kmsg-body {
        font-size: 15px;
        line-height: 1.6;
    }

    #kunena.layout .ktopic-list .krow {
        padding: 8px 10px;
    }

    #kunena.layout .kmsg-title h4 {
        font-size: 18px;
    }
}

/* Correctif 2026-11-04 : couleur des titres de sujets (la regle de KBee est plus forte) et espaceur */
#kunena.layout .ktopic-list-wrap .ktopic-list .kcol-subject .ktopic-title-wrap h3 a {
    color: #2F5B7C;
}

#kunena.layout .ktopic-list-wrap .ktopic-list .kcol-subject .ktopic-title-wrap h3 a:hover {
    color: #1E3E57;
}

#kunena.layout .ktopic-list .kcontenttablespacer {
    height: 8px;
    min-height: 0;
    line-height: 0;
    padding: 0;
    margin: 0;
    border: 0;
}

/* Correctif 2026-11-04 : filtre « Periode » des listes de sujets, aux normes de l'accueil (pastille beige, etiquette bleue, menu blanc) */
#kunena.layout .kpage-title-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 8px 24px;
    margin-bottom: 12px;
}

#kunena.layout #filter-time {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #F2F1EE;
    border: 1px solid #E4E1DB;
    border-radius: 8px;
    padding: 6px 8px 6px 16px;
}

#kunena.layout #filter-time .filter-sel {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    color: #4A7295;
    margin: 0;
    line-height: 1;
}

#kunena.layout #filter-time form {
    margin: 0;
}

#kunena.layout #filter-time select {
    height: 40px;
    width: auto;
    min-width: 180px;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    color: #26292C;
    background-color: #fff;
    border: 1px solid #d5d5d5;
    border-radius: 6px;
    padding: 0 34px 0 12px;
}

#kunena.layout #filter-time select:focus {
    border-color: #5388B4;
    outline: 2px solid rgba(83, 136, 180, .3);
    outline-offset: 0;
}

/* ===== FIN section et sujet ===== */

/* =====================================================================
 * LaMortaise.com : forum, lot 1 « navigation » (menu de gauche, fil d'Ariane,
 * titre de page, pagination, recherche)
 * Prepare et publie le 2026-11-04 (apercu valide par David).
 * A la fin de templates/yootheme/css/nts_kbee_custom.css (charge seulement sur les pages du forum).
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN lot 1 navigation »).
 * Boutons Kunena (Repondre, Citer...) : NON inclus, a faire apres verification connecte.
 * ===================================================================== */

/* --- Menu de gauche (module 225) --- */
#module-225 .uk-nav-default > li > a {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 16px;
    line-height: 1.3;
    padding: 9px 12px;
    border-radius: 8px;
    color: #26292C;
}

#module-225 .uk-nav-default > li > a:hover {
    background: #E8EDF2;
    color: #1E3E57;
}

#module-225 .uk-nav-default > li.uk-active > a {
    background: #EAF0F5;
    color: #1E3E57;
    font-weight: 700;
}

/* --- Fil d'Ariane --- */
.uk-breadcrumb,
.uk-breadcrumb * {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
}

.uk-breadcrumb > * > * {
    color: #5B5A57;
}

.uk-breadcrumb > * > a:hover {
    color: #2F5B7C;
    text-decoration: none;
}

.uk-breadcrumb > :last-child > span {
    color: #26292C;
    font-weight: 600;
}

/* --- Titre de page (listes « recents », « sans reponse ») --- */
#kunena.layout .kpage-title {
    font-family: Kreon, Georgia, serif;
    font-size: 32px;
    line-height: 1.15;
    margin: 0;
}

#kunena.layout .kpage-title small {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #5B5A57;
    margin-left: 8px;
}

/* --- Pagination : un bouton arrondi par page --- */
#kunena.layout .kpagination-wrap .pagination {
    gap: 4px;
    margin: 0;
}

#kunena.layout .kpagination-wrap .pagination .page-item .page-link {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 600;
    min-width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    margin: 0;
    border: 1px solid #d5d5d5;
    border-radius: 6px;
    background: #fff;
    color: #2F5B7C;
    box-shadow: none;
}

#kunena.layout .kpagination-wrap .pagination .page-item .page-link:hover {
    background: #E8EDF2;
    color: #1E3E57;
}

#kunena.layout .kpagination-wrap .pagination .page-item.active .page-link {
    background: #5388B4;
    border-color: #5388B4;
    color: #fff;
}

#kunena.layout .kpagination-wrap .pagination .page-item.disabled .page-link {
    background: #F2F1EE;
    color: #8a9096;
}

/* --- Recherche de la liste --- */
#kunena.layout .kunena-search .form-control {
    height: 40px;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    border: 1px solid #d5d5d5;
    border-radius: 6px 0 0 6px;
    box-shadow: none;
}

#kunena.layout .kunena-search .form-control:focus {
    border-color: #5388B4;
    outline: 2px solid rgba(83, 136, 180, .3);
    outline-offset: 0;
}

#kunena.layout .kunena-search .kbtn.kbtn-primary {
    height: 40px;
    background: #5388B4;
    border: 1px solid #5388B4;
    border-radius: 0 6px 6px 0;
    color: #fff;
}

#kunena.layout .kunena-search .kbtn.kbtn-primary:hover {
    background: #4A7295;
    border-color: #4A7295;
}

#kunena.layout .kunena-search .kbtn.kbtn-primary i {
    color: #fff;
    opacity: 1;
}
/* Correctif 2026-11-04 : selecteurs renforces (YOOtheme et KBee avaient des regles plus fortes) */
ul.uk-breadcrumb > li:last-child > span:not(a) {
    color: #26292C;
    font-weight: 600;
}

#kunena.layout .kpage-header .kpage-title-wrap h1.kpage-title {
    font-size: 32px;
    line-height: 1.15;
}

/* Correctif 2026-11-04 : premier et dernier bouton de la pagination (Bootstrap les arrondissait a 0) */
#kunena.layout .kpagination-wrap .pagination .page-item:first-child .page-link,
#kunena.layout .kpagination-wrap .pagination .page-item:last-child .page-link,
#kunena.layout .kpagination-wrap .pagination .page-item:not(:first-child) .page-link {
    border-radius: 6px;
    margin-left: 0;
}

/* ===== FIN lot 1 navigation ===== */

/* =====================================================================
 * LaMortaise.com : forum, lot 2 « listes et messages »
 * (barres de la liste, icones, badges, colonne du membre, signature,
 *  remerciements, invitation a participer, boite des pieces jointes vide)
 * Prepare le 2026-11-04 (apercu valide par David). A AJOUTER A LA FIN de
 * templates/yootheme/css/nts_kbee_custom.css, apres « FIN lot 1 navigation ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN lot 2 listes et messages »).
 * Les couleurs des roles (administrateur, moderateur) ne sont PAS modifiees.
 * ===================================================================== */

/* --- Liste des sujets : barres haute et basse --- */
#kunena.layout .ktopic-list-header .krow {
    padding: 4px 14px;
    min-height: 0;
}

#kunena.layout .ktopic-list-header .kcol-icon {
    padding: 0;
}

#kunena.layout .ktopic-list-footer,
#kunena.layout .ktopic-list-wrap .ktopic-list-footer .krow {
    background: #F2F1EE;
    border-top: 1px solid #E4E1DB;
    padding: 4px 14px;
}

#kunena.layout .ktopic-list-footer a,
#kunena.layout .ktopic-list-footer i {
    color: #4A7295;
}

/* --- Icones et badges --- */
#kunena.layout .ktopic-list .kcol-icon i {
    color: #5388B4;
}

/* Pastille « (n Nouveau(x)) » : reservee au petit texte (sup). L'icone de dossier des sections non lues
   (classe knewchar aussi) n'est plus touchee. Le template ecrit sa propre regle verte avec !important :
   selecteur plus precis + !important pour garder le texte lisible (blanc sur vert). */
#kunena.layout .krow sup.knewchar,
#kunena.layout .ktopic-title-wrap sup.knewchar,
#kunena.layout .klatest-items sup.knewchar {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #fff !important;
    background: #3E7D5A;
    border-radius: 999px;
    padding: 2px 8px;
    margin-left: 6px;
    vertical-align: middle;
}

#kunena.layout .ktopic-badge .badge,
#kunena.layout .ktopic-meta .badge {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-weight: 700;
    border-radius: 999px;
    padding: 3px 9px;
}

#kunena.layout .ktopic-meta a {
    color: #2F5B7C;
}

/* --- Colonne du membre (les couleurs des roles restent) --- */
#kunena.layout .kmessage-profile .kuser-avatar img {
    border-radius: 8px;
}

#kunena.layout .kmessage-profile .kuser-name,
#kunena.layout .kmessage-profile .kuser-name a {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-weight: 700;
    font-size: 15px;
}

#kunena.layout .kmessage-profile .kuser-rank-title,
#kunena.layout .kmessage-profile .kuser-posts,
#kunena.layout .kmessage-profile .kuser-thankyou,
#kunena.layout .kmessage-profile .kpersonal-text {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 13px;
    color: #5B5A57;
}

#kunena.layout .kmessage-profile .kuser-status span,
#kunena.layout .kmessage-profile .ktopic-starter {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    border-radius: 999px;
    padding: 2px 9px;
}

/* --- Pied du message : signature, remerciements, invitation a participer --- */
#kunena.layout .ksig {
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px solid #E4E1DB;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 13px;
    color: #5B5A57;
}

#kunena.layout .kmessage-thankyou {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
    color: #45484B;
    background: #F2F1EE;
    border-radius: 8px;
    padding: 8px 12px;
    margin: 12px 0;
}

#kunena.layout .kmessage-thankyou i {
    color: #5388B4;
    margin-right: 8px;
}

#kunena.layout .kmessage-body a.btn-link {
    font-weight: 700;
    color: #2F5B7C;
    text-decoration: underline;
}

#kunena.layout .kmessage-body > p:has(a.btn-link) {
    background: #F2F1EE;
    border: 1px solid #E4E1DB;
    border-radius: 8px;
    padding: 12px 16px;
    margin: 12px 0 0;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
}

/* Boite des pieces jointes vide (pointillee) : cachee */
#kunena.layout .kattachment-wrapper:not(:has(li)) {
    display: none;
}
/* Correctif 2026-11-04 : selecteurs renforces (KBee avait des regles plus fortes : arrondi des remerciements, taille de la signature) */
#kunena.layout .kmessage-body .kmessage-thankyou {
    border-radius: 8px;
}

#kunena.layout .kmessage-body .ksig,
#kunena.layout .kmessage-body .ksig .ksignature,
#kunena.layout .kmessage-body .ksig .ksignature span {
    font-size: 13px;
}

/* ===== FIN lot 2 listes et messages ===== */

/* =====================================================================
 * LaMortaise.com : forum, lot 3 « boutons et notes des messages »
 * (boutons Kunena : Reponse rapide, Repondre, Citer, Editer, Moderer, Supprimer,
 *  Remercier ; note « Derniere edition » ; cadre des pieces jointes)
 * Prepare le 2026-11-04 d'apres une capture de David (vue connecte) ;
 * apercu fait avec des boutons simules (memes classes que Kunena).
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN lot 2 listes et messages ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN lot 3 boutons »).
 * ===================================================================== */

/* --- Boutons Kunena : contour bleu, texte bleu fonce ; le principal est plein --- */
#kunena.layout .kbtn,
#kunena.layout .kbtn-sm,
#kunena.layout .kbtn-small {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    background: #fff;
    border: 1px solid #5388B4;
    color: #2F5B7C;
    border-radius: 8px;
    padding: 8px 14px;
    gap: 8px;
}

#kunena.layout .kbtn:hover,
#kunena.layout .kbtn-sm:hover,
#kunena.layout .kbtn-small:hover,
#kunena.layout .kbtn:focus,
#kunena.layout .kbtn:active {
    background: #5388B4;
    border-color: #5388B4;
    color: #fff;
}

#kunena.layout .kbtn i,
#kunena.layout .kbtn svg,
#kunena.layout .kbtn-sm i,
#kunena.layout .kbtn-small i {
    opacity: 1;
    color: inherit;
}

#kunena.layout .kbtn-primary {
    background: #5388B4;
    border-color: #5388B4;
    color: #fff;
}

#kunena.layout .kbtn-primary:hover,
#kunena.layout .kbtn-primary:focus,
#kunena.layout .kbtn-primary:active {
    background: #4A7295;
    border-color: #4A7295;
    color: #fff;
}

/* --- Note « Derniere edition » (alerte d'information) --- */
#kunena.layout .kmessage-body .alert.alert-info {
    background: #F2F1EE;
    border: 1px solid #E4E1DB;
    color: #5B5A57;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 13px;
    border-radius: 8px;
    padding: 8px 12px;
}

#kunena.layout .kmessage-body .alert.alert-info a {
    color: #2F5B7C;
    font-weight: 700;
}

/* --- Cadre des pieces jointes (etait pointille) --- */
#kunena.layout .kattachment-wrapper:has(li) {
    border: 1px solid #E4E1DB;
    border-radius: 8px;
}

#kunena.layout .kattachment-wrapper .kattach-list > li {
    border-color: #E4E1DB;
    border-radius: 6px;
}
/* ===== FIN lot 3 boutons ===== */

/* =====================================================================
 * LaMortaise.com : forum, profil d'un membre, page « resume »
 * Prepare le 2026-11-04 d'apres le code HTML et les captures de David (vue connecte).
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN lot 3 boutons ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN profil resume »).
 * Apparence seulement : aucun renseignement du profil n'est modifie.
 * Cause du bouton invisible : kunena.css met « .kuser-links a {background:#fff} » avec
 * une regle plus forte que .kbtn-primary ; les regles ci-dessous sont donc au meme niveau.
 * ===================================================================== */

/* --- Carte du profil : coins arrondis, filet de la charte --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-inner {
    background: #F2F1EE;
    border: 1px solid #E4E1DB;
    border-radius: 8px;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: #26292C;
}

/* --- Colonne de gauche : avatar (plus de cercle blanc) --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar > a {
    background: transparent;
    border-radius: 8px;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar img {
    border: 1px solid #E4E1DB;
    border-radius: 8px;
    background: #fff;
}

/* --- Boutons sous l'avatar --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links {
    flex-wrap: nowrap;   /* une seule rangee : Messages prives a gauche des deux icones */
}

/* Contour bleu, icone ou texte bleu fonce */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn {
    background: #fff;
    border: 1px solid #5388B4;
    border-radius: 8px;
    color: #2F5B7C;
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    padding: 8px;   /* meme marge qu'avant (0.5rem), pour garder la disposition actuelle */
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn:hover,
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn:focus {
    background: #5388B4;
    color: #fff;
}

/* « Messages prives » : bouton plein, texte blanc visible */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn.kbtn-primary {
    background: #5388B4;
    border-color: #5388B4;
    color: #fff;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn.kbtn-primary:hover,
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn.kbtn-primary:focus {
    background: #4A7295;
    border-color: #4A7295;
    color: #fff;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn i {
    color: inherit;
}

/* --- Colonne de droite : informations (Nunito Sans, etiquettes grises) --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li strong {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-weight: 600;   /* le site ne charge que 300, 400 et 600 */
    color: #4A7295;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li span {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    color: #26292C;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li a {
    color: #2F5B7C;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li a:hover {
    color: #1E3E57;
}

/* Filet au-dessus des reseaux sociaux : couleur de la charte */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-socials {
    border-top-color: #E4E1DB;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-socials a {
    color: #5388B4;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-socials a:hover {
    color: #2F5B7C;
}

/* Signature */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-signature {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    color: #26292C;
}

/* ===== FIN profil resume ===== */

/* =====================================================================
 * LaMortaise.com : forum, profil d'un membre, mise en page COMPACTE (choix A de David)
 * Prepare le 2026-11-04. Remplace le fichier 11 (non publie).
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN profil resume ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN profil compact »).
 * Apparence seulement : aucun renseignement n'est retire. Les 5 « tuiles » sont les
 * elements 2, 3, 7, 8 et 9 de la liste (Rang, Inscription, Messages, Consultations,
 * Remerciements) ; ces elements sont toujours dans cet ordre dans le code de Kunena.
 * Les autres (type, derniere connexion, fuseau, heure, lieu, genre, anniversaire)
 * passent en petit texte.
 * ===================================================================== */

/* --- Carte : plus basse --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-inner {
    padding: 1rem 1.25rem;
    align-items: flex-start;
}

/* --- Colonne de gauche : avatar et boutons de MEME largeur (170 px) --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-left {
    padding: 0.25rem 0.75rem;
    align-items: stretch;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar {
    max-width: none;
    width: 100%;
    margin-bottom: 0.6rem;
}

/* L'avatar prend toute la largeur de la colonne (= largeur des 3 boutons) ; la hauteur suit l'image */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar > a {
    width: 100%;
    display: block;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #E4E1DB;
    border-radius: 8px;
    box-sizing: border-box;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    border: 0;
    border-radius: 0;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar .kuser-status {
    bottom: 0.25rem;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar .kuser-status a {
    font-size: 11px;
    padding: 2px 8px 3px;
}

/* Boutons empiles, de la largeur de l'avatar : « Messages prives » au-dessus, les deux icones dessous */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links {
    width: 100%;
    flex-wrap: wrap;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn {
    justify-content: center;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn.kbtn-primary {
    flex: 1 1 100%;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn:not(.kbtn-primary) {
    flex: 1 1 calc(50% - 4px);
    display: flex;
    align-items: center;
}

/* Colonne de 194 px = 170 px de contenu + 2 x 12 px de marge */
@media (min-width: 768px) {
    #kunena.layout .kuser-profile-wrap .kuser-profile-left {
        flex: 0 0 194px;
        max-width: 194px;
    }
}

/* --- Colonne de droite --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-right {
    padding: 0.25rem 0.75rem;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 6px 8px;
}

/* Saut de ligne entre les tuiles (ordre -1), et les details (ordre 1) */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info::before {
    content: "";
    flex: 0 0 100%;
    order: 0;
    height: 0;
}

/* Details : petit texte « Etiquette valeur · Etiquette valeur » */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li {
    order: 1;
    flex: 0 0 auto;
    padding: 0;
    margin-right: 10px;   /* espace entre les details (18 px au total avec le gap) */
    border: 0;
    font-size: 14px;
    line-height: 1.5;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li strong,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li > span {
    display: inline;
    font-size: 14px;
}

/* Tuiles : Rang (2), Inscription (3), Messages (7), Consultations (8), Remerciements (9) */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-date,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-posts,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-views,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-thanks {
    order: -1;
    flex: 1 1 0;
    min-width: 100px;
    display: flex;
    flex-direction: column-reverse;   /* le chiffre au-dessus, l'etiquette en dessous */
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #fff;
    border: 1px solid #E4E1DB;
    border-radius: 8px;
    padding: 8px 6px;
    margin-right: 0;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank > span,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-date > span,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-posts > span,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-views > span,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-thanks > span {
    display: block;
    font-family: Kreon, Georgia, serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.15;
    color: #2F5B7C;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank > span {
    font-size: 15px;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank > span img {
    display: block;
    margin: 3px auto 0;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-date > span {
    font-size: 17px;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank > strong,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-date > strong,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-posts > strong,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-views > strong,
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-thanks > strong {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: #5B5A57;
}

/* Ordre des tuiles */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-posts { order: -5; }
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-thanks { order: -4; }
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-views { order: -3; }
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank { order: -2; }
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-date { order: -1; }

/* --- Reseaux sociaux et signature : serres --- */
#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-socials {
    border-top: 0;
    margin-top: 0.5rem;
    padding-top: 0;
}

#kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-signature {
    margin-top: 0.4rem;
}

/* ===== FIN profil compact ===== */

/* =====================================================================
 * LaMortaise.com : forum, onglets du profil (Messages, Abonnements, Favoris...)
 * Prepare le 2026-11-04 d'apres le code fourni par David.
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN profil compact ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN profil onglets »).
 * Les onglets sont des onglets Bootstrap (.nav-tabs) : la ligne grise est le ::after de la rangee,
 * le trait bleu est le ::after de l'onglet actif. Les onglets de l'editeur de message (.kpost-editor) ne sont pas touches.
 * ===================================================================== */

#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) {
    gap: 22px;
}

/* Ligne sous la rangee : fine, couleur de la charte */
#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs)::after {
    height: 2px;
    background: #E4E1DB;
}

#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #5B5A57;
    padding: 12px 0;
}

#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link:hover,
#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link:focus,
#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link:active {
    color: #2F5B7C;
}

/* Onglet actif : bleu fonce, un peu plus gras ; trait bleu de la charte */
#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link.active {
    font-weight: 600;
    color: #2F5B7C;
}

#kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link.active::after {
    background: #5388B4;
}

/* ===== FIN profil onglets ===== */

/* =====================================================================
 * Profil : le bouton « Messages prives (n) » reste sur une seule ligne (2026-11-04).
 * Retour en arriere : supprimer ce bloc (jusqu a « FIN profil bouton pm »).
 * ===================================================================== */
#kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links a.kbtn.kbtn-primary {
    white-space: nowrap;
    padding-left: 4px;
    padding-right: 4px;
    gap: 6px;
}
/* ===== FIN profil bouton pm ===== */

/* =====================================================================
 * LaMortaise.com : forum, profil d'un membre, TELEPHONE (moins de 768 px)
 * Prepare le 2026-11-04. Mesure dans un cadre de 386 px : avant ce bloc, la carte faisait
 * 881 px de haut (avatar pleine largeur), les tuiles etaient sur 3 rangees de 2 et les
 * 7 onglets sur plusieurs lignes (252 px).
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN profil onglets » (et apres « FIN profil bouton pm »).
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN profil mobile »).
 * Aucun effet au-dessus de 768 px (ordinateur et tablette).
 * ===================================================================== */

@media (max-width: 767px) {

    /* Carte : marges reduites, contenu centre */
    #kunena.layout .kuser-profile-wrap .kuser-profile-inner {
        padding: 0.75rem;
    }

    #kunena.layout .kuser-profile-wrap .kuser-profile-left {
        align-items: center;
        padding: 0.25rem 0 0.5rem;
        margin-bottom: 0.25rem;
    }

    /* Avatar : 120 px, centre */
    #kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-avatar {
        width: 120px;
        max-width: 120px;
    }

    /* Boutons : largeur limitee, centres */
    #kunena.layout .kuser-profile-wrap .kuser-profile-left .kuser-links {
        width: 100%;
        max-width: 300px;
    }

    #kunena.layout .kuser-profile-wrap .kuser-profile-right {
        padding: 0.25rem 0;
    }

    /* Tuiles : 3 par rangee (au lieu de 2) */
    #kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-rank,
    #kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-date,
    #kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-posts,
    #kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-views,
    #kunena.layout .kuser-profile-wrap .kuser-profile-right .kuser-info li.ktile-thanks {
        min-width: 88px;
        padding: 6px 4px;
    }

    /* Onglets : une seule rangee que l'on fait defiler du doigt */
    #kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    #kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs)::-webkit-scrollbar {
        display: none;
    }

    #kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item {
        flex: 0 0 auto;
    }

    #kunena.layout .nav.nav-tabs:not(.kpost-editor .nav-tabs) > .nav-item .nav-link {
        white-space: nowrap;
    }
}

/* ===== FIN profil mobile ===== */

/* =====================================================================
 * LaMortaise.com : forum, listes de sujets et de messages, TELEPHONE + police de la meta
 * Prepare le 2026-11-04 d'apres les captures du telephone de David et des mesures a 386 px.
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN profil mobile ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN forum mobile listes »).
 * Partie 1 (tous les ecrans) : police de la meta des listes (Nunito Sans au lieu de Kreon).
 * Partie 2 (moins de 768 px seulement) : titre, filtre « Periode », pagination et recherche.
 * Remarque : Kunena cache la liste deroulante du filtre sous 576 px (classes d-none d-sm-block) ;
 * on la remet pour que le filtre serve a quelque chose.
 * ===================================================================== */

/* --- Partie 1 : meta des listes (« Categorie : », « Sujet demarre... », « Dernier message par... ») --- */
#kunena.layout .ktopic-list .ktopic-meta,
#kunena.layout .ktopic-list .ktopic-meta *,
#kunena.layout .ktopic-list .kcol-latest-post,
#kunena.layout .ktopic-list .kcol-latest-post * {
    font-family: 'Nunito Sans', system-ui, sans-serif;
}

/* --- Partie 2 : telephone --- */
@media (max-width: 767px) {

    /* Titre de page plus petit, filtre en dessous sur toute la largeur */
    #kunena.layout .kpage-title-wrap:has(#filter-time) {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    #kunena.layout .kpage-title-wrap:has(#filter-time) h1.kpage-title {
        font-size: 26px;
        line-height: 1.2;
    }

    #kunena.layout #filter-time {
        width: 100%;
        box-sizing: border-box;
        padding: 6px 8px 6px 14px;
    }

    #kunena.layout #filter-time form {
        display: block !important;   /* Kunena la cache sous 576 px */
        flex: 1 1 auto;
    }

    #kunena.layout #filter-time select {
        width: 100%;
        min-width: 0;
    }

    /* Le profil a un 2e formulaire de periode pour telephone (#timeselect-mobile) : la pastille le remplace */
    #kunena.layout #timeselect-mobile {
        display: none !important;
    }

    /* Pagination puis recherche : l'une sous l'autre, sur toute la largeur */
    #kunena.layout .ktopic-filter {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    #kunena.layout .ktopic-filter .kpagination-wrap,
    #kunena.layout .ktopic-filter .ktopic-search-wrap,
    #kunena.layout .ktopic-filter .kunena-search {
        width: 100%;
    }

    #kunena.layout .ktopic-filter .kpagination-wrap .pagination {
        flex-wrap: wrap;
        row-gap: 6px;
    }
}

/* ===== FIN forum mobile listes ===== */

/* =====================================================================
 * LaMortaise.com : forum, barre d'actions en bas des listes (moderateurs seulement)
 * « Plus d'informations » / « - Choisissez une action - » / « Aller »
 * Prepare le 2026-11-04 d'apres les captures de David. Code des modeles :
 * components/com_kunena/template/nts_kbee/layouts/message/list/default.php et topic/list/default.php.
 * A AJOUTER A LA FIN de templates/yootheme/css/nts_kbee_custom.css,
 * apres « FIN forum mobile listes ».
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN barre actions listes »).
 * Cause : le « input-group » de Bootstrap enleve les coins arrondis et colle les elements,
 * et une regle des liens met le texte du bouton « Plus d'informations » en fonce sur fond bleu.
 * ===================================================================== */

/* La colonne des boutons est limitee a 250 px par le template (« .krow .kcol:last-child ») :
   trop etroit pour les trois elements, qui passaient lun sous lautre. */
#kunena.layout .ktopic-list-footer .krow .kcol.kcol-auto {
    max-width: none;
}

/* Le groupe lui-meme est limite a 480 px (« .ktopic-list-footer .form-group ») : avec des options
   longues dans la liste d'actions, « Aller » passait sous les autres. On enleve la limite et on
   plafonne la liste a 300 px. */
#kunena.layout .ktopic-list-wrap .ktopic-list-footer .form-group {
    max-width: none;
}

#kunena.layout .ktopic-list-footer .input-group select.form-select {
    max-width: 300px;
}

/* Les elements ne sont plus colles : rangee qui passe a la ligne, espace de 8 px */
#kunena.layout .ktopic-list-footer .input-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

#kunena.layout .ktopic-list-footer .input-group > * {
    margin-left: 0;
}

/* Boutons : meme style que les autres boutons principaux du forum */
#kunena.layout .ktopic-list-footer .input-group a.kbtn.kbtn-primary,
#kunena.layout .ktopic-list-footer .input-group input.kbtn.kbtn-primary,
#kunena.layout .ktopic-list-footer .input-group button.kbtn.kbtn-primary {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    background: #5388B4;
    border: 1px solid #5388B4;
    border-radius: 8px;
    padding: 9px 16px;
    width: auto;
    flex: 0 0 auto;
}

#kunena.layout .ktopic-list-footer .input-group a.kbtn.kbtn-primary:hover,
#kunena.layout .ktopic-list-footer .input-group a.kbtn.kbtn-primary:focus,
#kunena.layout .ktopic-list-footer .input-group input.kbtn.kbtn-primary:hover,
#kunena.layout .ktopic-list-footer .input-group input.kbtn.kbtn-primary:focus,
#kunena.layout .ktopic-list-footer .input-group button.kbtn.kbtn-primary:hover,
#kunena.layout .ktopic-list-footer .input-group button.kbtn.kbtn-primary:focus {
    color: #fff;
    background: #4A7295;
    border-color: #4A7295;
}

/* Listes deroulantes : champs de la charte (6 px, bordure fine) */
#kunena.layout .ktopic-list-footer .input-group select.form-select {
    font-family: 'Nunito Sans', system-ui, sans-serif;
    font-size: 14px;
    color: #26292C;
    background-color: #fff;
    border: 1px solid #d5d5d5;
    border-radius: 6px;
    height: 38px;
    width: auto;
    min-width: 200px;
    flex: 0 1 auto;
}

#kunena.layout .ktopic-list-footer .input-group select.form-select:focus {
    border-color: #5388B4;
    outline: 2px solid rgba(83, 136, 180, .3);
    outline-offset: 0;
}

/* Telephone : chaque element sur toute la largeur */
@media (max-width: 767px) {
    #kunena.layout .ktopic-list-footer .input-group a.kbtn.kbtn-primary,
    #kunena.layout .ktopic-list-footer .input-group input.kbtn.kbtn-primary,
    #kunena.layout .ktopic-list-footer .input-group button.kbtn.kbtn-primary,
    #kunena.layout .ktopic-list-footer .input-group select.form-select {
        flex: 1 1 100%;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        text-align: center;
    }
}

/* ===== FIN barre actions listes ===== */


/* =====================================================================
 * Defilement : retour au saut instantane vers le dernier message (4 nov. 2026).
 * Bootstrap 5.3 (charge avec Kunena 7) contient « :root { scroll-behavior: smooth } » :
 * la page s'ouvrait en haut puis glissait jusqu'au message. Signale par plusieurs membres.
 * Retour en arriere : supprimer ce bloc (jusqu'a « FIN defilement »).
 * ===================================================================== */
html:root {
    scroll-behavior: auto;
}
/* ===== FIN defilement ===== */