@charset "UTF-8";/* Forum Kunena 6 (gabarit aurelia) et pages Joomla écrites pour Bootstrap 5, au design system Config Gamer.
   Les variables Bootstrap sont reliées aux variables --cg-* : clair et sombre suivent le reste du site. */

.cg-principal {
  --bs-body-bg: var(--cg-surface);
  --bs-body-color: var(--cg-texte);
  --bs-body-font-family: var(--cg-police-texte);
  --bs-emphasis-color: var(--cg-texte);
  --bs-secondary-color: var(--cg-discret);
  --bs-tertiary-color: var(--cg-discret-2);
  --bs-secondary-bg: var(--cg-surface-2);
  --bs-tertiary-bg: var(--cg-surface-2);
  --bs-border-color: var(--cg-ligne-2);
  --bs-border-color-translucent: var(--cg-ligne-2);
  --bs-border-radius: var(--cg-rayon);
  --bs-border-radius-sm: var(--cg-rayon-petit);
  --bs-link-color: var(--cg-accent-texte);
  --bs-link-color-rgb: 176, 0, 0;
  --bs-link-hover-color: var(--cg-accent);
  --bs-primary: var(--cg-accent);
  --bs-primary-rgb: 176, 0, 0;
  --bs-heading-color: var(--cg-texte);
  --bs-card-bg: var(--cg-surface);
  color: var(--cg-texte);
}
html[data-theme="sombre"] .cg-principal { --bs-link-color-rgb: 255, 90, 82; --bs-primary-rgb: 208, 22, 27; }

/* Bootstrap fixe body/fond : on garde ceux du gabarit */
body { background: var(--cg-fond) !important; color: var(--cg-texte) !important; font-family: var(--cg-police-texte) !important; }

.cg-principal .card, .cg-principal .well, .cg-principal .kfrontend, .cg-principal .table-responsive, #kunena .kblock {
  background: var(--cg-surface); border: 0; border-radius: var(--cg-rayon); box-shadow: var(--cg-ombre); color: var(--cg-texte);
}
.cg-principal .card-header, #kunena .card-header, #kunena .kheader, #kunena thead th, #kunena .table thead th {
  background: var(--cg-entete) !important; color: #fff !important; border-bottom: 3px solid var(--cg-accent) !important;
  font-family: var(--cg-police-titre); font-weight: 700;
}
#kunena .card-header a, #kunena thead th a, #kunena .kheader a { color: #fff !important; }
.cg-principal .table {
  --bs-table-bg: var(--cg-surface); --bs-table-color: var(--cg-texte); --bs-table-border-color: var(--cg-ligne);
  --bs-table-striped-bg: var(--cg-surface-2); --bs-table-striped-color: var(--cg-texte); --bs-table-hover-bg: var(--cg-accent-doux); --bs-table-hover-color: var(--cg-texte);
  margin-bottom: 16px; border-radius: var(--cg-rayon); overflow: hidden;
}
.cg-principal .table > :not(caption) > * > * { padding: 10px 14px; border-bottom-color: var(--cg-ligne); }

#kunena h1, #kunena h2, #kunena h3, .cg-principal .page-header h1, .cg-principal .page-header h2 { font-family: var(--cg-police-titre); font-weight: 700; }
#kunena h1 { font-size: clamp(28px, 3.4vw, 36px); }
#kunena .ktopic-title, #kunena .topictitle, #kunena .ktopic-title a { font-weight: 600; color: var(--cg-texte); }
#kunena a:hover .ktopic-title, #kunena .ktopic-title a:hover { color: var(--cg-accent-texte); }
#kunena .kmsg, #kunena .kmessage { font-size: 16px; line-height: 1.65; overflow-wrap: anywhere; }
#kunena .kmsg img { border-radius: var(--cg-rayon-petit); }
#kunena blockquote, #kunena .kmsgtext-quote { border-left: 4px solid var(--cg-accent); background: var(--cg-surface-2); padding: 10px 14px; border-radius: 0 var(--cg-rayon-petit) var(--cg-rayon-petit) 0; }
#kunena .badge, .cg-principal .badge { background: var(--cg-surface-2) !important; color: var(--cg-texte) !important; font-weight: 500; }
#kunena .badge.bg-danger, #kunena .badge.bg-primary { background: var(--cg-accent) !important; color: #fff !important; }
#kunena .kwho-admin, #kunena .kwho-globalmoderator, #kunena .kwho-moderator { color: var(--cg-accent-texte) !important; }

.cg-principal .btn { border-radius: var(--cg-rayon-petit); font-weight: 600; }
.cg-principal .btn-primary, .cg-principal .btn-success, #kunena .btn-primary {
  --bs-btn-bg: var(--cg-accent); --bs-btn-border-color: var(--cg-accent); --bs-btn-hover-bg: var(--cg-accent-fonce); --bs-btn-hover-border-color: var(--cg-accent-fonce);
  --bs-btn-active-bg: var(--cg-accent-fonce); --bs-btn-color: #fff; --bs-btn-hover-color: #fff;
}
.cg-principal .btn-outline-primary, .cg-principal .btn-light, .cg-principal .btn-secondary, .cg-principal .btn-outline-secondary, .cg-principal .btn-default {
  --bs-btn-bg: var(--cg-surface-2); --bs-btn-color: var(--cg-texte); --bs-btn-border-color: var(--cg-ligne-2);
  --bs-btn-hover-bg: var(--cg-actif); --bs-btn-hover-color: var(--cg-actif-texte); --bs-btn-hover-border-color: var(--cg-actif);
}
.cg-principal .form-control, .cg-principal .form-select, .cg-principal .inputbox {
  background: var(--cg-surface); color: var(--cg-texte); border-color: var(--cg-ligne-2); border-radius: var(--cg-rayon-petit);
}
.cg-principal .form-control:focus, .cg-principal .form-select:focus { border-color: var(--cg-accent); box-shadow: 0 0 0 .2rem rgba(176, 0, 0, .2); }
.cg-principal .nav-tabs { --bs-nav-tabs-border-color: var(--cg-ligne-2); --bs-nav-tabs-link-active-bg: var(--cg-surface); --bs-nav-tabs-link-active-color: var(--cg-accent-texte); --bs-nav-tabs-link-active-border-color: var(--cg-ligne-2) var(--cg-ligne-2) var(--cg-surface); }
.cg-principal .nav-link { color: var(--cg-texte); }
.cg-principal .pagination { --bs-pagination-bg: var(--cg-surface); --bs-pagination-color: var(--cg-texte); --bs-pagination-border-color: var(--cg-ligne-2); --bs-pagination-active-bg: var(--cg-actif); --bs-pagination-active-border-color: var(--cg-actif); --bs-pagination-active-color: var(--cg-actif-texte); --bs-pagination-hover-bg: var(--cg-surface-2); --bs-pagination-hover-color: var(--cg-accent-texte); }
.cg-principal .dropdown-menu { --bs-dropdown-bg: var(--cg-surface); --bs-dropdown-color: var(--cg-texte); --bs-dropdown-link-color: var(--cg-texte); --bs-dropdown-link-hover-bg: var(--cg-surface-2); --bs-dropdown-border-color: var(--cg-ligne-2); }
.cg-principal .alert { border-radius: var(--cg-rayon); }
.cg-principal .list-group { --bs-list-group-bg: var(--cg-surface); --bs-list-group-color: var(--cg-texte); --bs-list-group-border-color: var(--cg-ligne); }
#kunena .kavatar, #kunena img.kavatar { border-radius: 50%; }
#kunena .krow-new, #kunena .knewchar { color: var(--cg-accent-texte); font-weight: 700; }
#kunena .table-striped > tbody > tr:nth-of-type(odd) > * { --bs-table-bg-type: var(--cg-surface-2); }

/* Blocs ajoutés par plg_system_cgforum (sujets proches) et liens vers les guides */
.cgf-similaires { padding: 16px 18px; background: var(--cg-surface); border-radius: var(--cg-rayon); box-shadow: var(--cg-ombre); }
.cgf-similaires h2 { margin-top: 0; font-family: var(--cg-police-titre); }
.cgf-haut a { color: var(--cg-accent-texte) !important; }
#kunena a.cgf-guide { color: var(--cg-accent-texte); text-decoration: underline; text-decoration-thickness: 1px; }

/* Forum au plus près de la maquette C : un seul fil d'Ariane (celui du gabarit), lignes de sujets aérées, titres sans
   soulignement, la catégorie n'est plus répétée sur chaque ligne d'une catégorie. */
#kunena nav[aria-label="breadcrumbs"], #kunena .mod-kunena-breadcrumbs { display: none; }
.view-category #kunena .ktopic-category, .view-category #kunena .ktopic-category + br { display: none; }
#kunena a.topictitle { color: var(--cg-texte); font-weight: 600; font-size: 17px; text-decoration: none; }
#kunena a.topictitle:hover, #kunena a.topictitle:focus-visible { color: var(--cg-accent-texte); text-decoration: underline; }
#kunena .started { margin-top: 2px; font-size: 13px; color: var(--cg-discret-2); }
#kunena .started a, #kunena .lastpostlink a, #kunena a.kwho-user, #kunena .ktopic-category a { text-decoration: none; }
#kunena .replies, #kunena .views { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--cg-discret-2); }
#kunena .repliesnum, #kunena .viewsnum { font-weight: 700; color: var(--cg-texte); }
#kunena table > tbody > tr > td, #kunena table > tbody > tr > th { padding-top: 12px; padding-bottom: 12px; vertical-align: middle; }
#kunena table > tbody > tr > th svg { color: var(--cg-discret-2); width: 22px; height: 22px; }
#kunena h1.alert { font-size: inherit; }

/* Mode sombre : barre de menu Kunena (navbar-light bg-light) et bandeaux de catégorie (images sombres sur fond
   transparent) restent lisibles. */
html[data-theme="sombre"] #kunena .navbar.bg-light { background: var(--cg-surface) !important; border-color: var(--cg-ligne-2) !important; }
html[data-theme="sombre"] #kunena .navbar-light .nav-link, html[data-theme="sombre"] #kunena .navbar-light .navbar-toggler { color: var(--cg-texte); }
html[data-theme="sombre"] #kunena .navbar-light .navbar-toggler-icon { filter: invert(1); }
html[data-theme="sombre"] #kunena h1.alert-dismissible { background: #fff; color: #1b1b1e; }
html[data-theme="sombre"] #kunena h1.alert-dismissible .btn-close { filter: none; }
/* Téléphone : catégories du forum (colonne de gauche) en pastilles au-dessus de la liste, comme la maquette mobile. */
@media (max-width: 960px) { .cg-forum .cg-colonne--gauche { order: -1; } }

/* ===== Repasse design du forum (22/10, maquettes C-Forum, C-Sujet, C-Profil) =====
   Va avec les overrides html/com_kunena/layouts/topic/item, topic/item/message et message/item/top. */

/* Restes d'Aurelia : fil d'Ariane Kunena (boîte « Le forum des configs »), saut de forum, bandeau image de catégorie. */
#kunena .pagination-container-links, #kunena form#jumpto,
#kunena h1[id^="category-headerdesc"], #kunena [id^="topic-item-category-headerdesc"] { display: none !important; }
#kunena > br, #kunena .kcontenttablespacer { display: none; }

/* Barre de menu du forum : une seule ligne qui défile plutôt que 3 lignes coupées. */
#kunena .navbar { padding: 4px 8px; box-shadow: var(--cg-ombre) !important; }
#kunena .navbar .navbar-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
#kunena .navbar .nav-link { white-space: nowrap; font-size: 14px; font-weight: 500; padding: 10px 12px; }
#kunena .navbar .nav-link.active, #kunena .navbar .nav-item.active > .nav-link { color: var(--cg-accent-texte); box-shadow: inset 0 -3px 0 var(--cg-accent); }

/* Index et listes : plus de liste de modérateurs sous chaque catégorie, « (48 Nouveau(x) ) » en pastille,
   icônes de dossier neutres, titres sans soulignement. */
#kunena .moderators { display: none; }
html body #kunena.layout.layout [class*="category"] sup.knewchar.knewchar, html body #kunena.layout sup.knewchar, #kunena sup.knewchar, #kunena sup.knewchar * { top: -1px; margin-left: 6px; color: var(--cg-accent-texte) !important; font-size: 12px; font-weight: 600;
  font-family: var(--cg-police-texte); letter-spacing: 0; text-transform: none; vertical-align: middle; white-space: nowrap; background: none; }
#kunena #kcat-icon svg, #kunena td[id^="kcat-icon"] svg { color: var(--cg-discret-2); width: 22px; height: 22px; }
#kunena tr.category h3 { margin: 0 0 2px; font-size: 20px; }
#kunena tr.category h3 a { color: var(--cg-texte); text-decoration: none; }
#kunena tr.category h3 a:hover, #kunena tr.category h3 a:focus-visible { color: var(--cg-accent-texte); text-decoration: underline; }
#kunena tr.category-stickymsg > * { background: var(--cg-accent-doux) !important; box-shadow: none !important; }
/* Sujets supprimés (visibles des seuls modérateurs) : un libellé plutôt qu'un gris plein. */
#kunena tr.deleted, #kunena tr.deleted > *, #kunena tr.deleted td, #kunena tr.deleted th { --bs-table-bg: transparent; --bs-table-accent-bg: transparent; background: transparent !important; box-shadow: none !important; opacity: .62; }
#kunena tr.deleted a.topictitle::before { content: "Supprimé · "; color: var(--cg-accent-texte); font-weight: 600; }
/* Cases de modération : pas sur téléphone (elles prenaient une ligne entière). */
@media (max-width: 767px) { #kunena td:has(input[type="checkbox"]), #kunena th:has(input[type="checkbox"]) { display: none !important; } }

/* Page sujet (override topic/item) */
.cgk-sujet__tete { background: var(--cg-surface); border-radius: var(--cg-rayon); box-shadow: var(--cg-ombre); padding: 18px 20px; margin: 0 0 14px; }
#kunena .cgk-sujet__titre { margin: 0; font-size: clamp(26px, 3vw, 34px); line-height: 1.1; background: none; color: var(--cg-texte); padding: 0; }
.cgk-sujet__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 0; font-size: 13px; color: var(--cg-discret-2); }
.cgk-sujet__actions { margin-top: 12px; }
.cgk-sujet__actions .btn-toolbar, .cgk-sujet__actions > div { display: flex; flex-wrap: wrap; gap: 6px; }
.cgk-pastille { display: inline-block; margin-right: 8px; padding: 2px 10px; border-radius: 10px; background: var(--cg-surface-2);
  font-family: var(--cg-police-texte); font-size: 13px; font-weight: 600; vertical-align: middle; color: var(--cg-discret); }
.cgk-barre { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 14px; }
.cgk-barre .pagination { margin: 0; }
.cgk-barre--bas { margin-top: 4px; }

/* Message en carte (override topic/item/message + message/item/top) */
.cgk-post { background: var(--cg-surface); border-radius: var(--cg-rayon); box-shadow: var(--cg-ombre); margin: 0 0 14px; overflow: hidden; }
.cgk-post__tete { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 12px 18px; border-bottom: 1px solid var(--cg-ligne); }
.cgk-post__tete--equipe { background: var(--cg-accent-doux); }
.cgk-post__portrait { flex: none; }
.cgk-post__portrait img, .cgk-post__portrait .cgk-post__avatar { width: 44px !important; height: 44px !important; border-radius: 50%; object-fit: cover; display: block; }
.cgk-post__initiales { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--cg-surface-2);
  font-family: var(--cg-police-titre); font-weight: 700; font-size: 18px; }
.cgk-post__qui { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.cgk-post__nom { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-weight: 600; }
.cgk-post__nom > a { text-decoration: none; }
.cgk-badge { padding: 1px 8px; border-radius: 10px; background: var(--cg-surface-2); color: var(--cg-discret); font-size: 12px; font-weight: 600; }
.cgk-badge--equipe { background: var(--cg-accent); color: #fff; }
.cgk-post__detail { font-size: 13px; color: var(--cg-discret-2); }
.cgk-post__quand { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: 13px; color: var(--cg-discret-2); }
.cgk-post__quand a { color: var(--cg-discret-2); text-decoration: none; }
.cgk-post__corps { padding: 14px 18px 6px; }
.cgk-post .kmsg { font-size: 16px; line-height: 1.65; }
.cgk-post .ksig { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--cg-ligne-2); font-size: 13px; color: var(--cg-discret-2); }
.cgk-post .report { padding: 0 18px !important; text-align: right; }
.cgk-post .report .btn { background: transparent; border: 0; color: var(--cg-discret-2); font-weight: 500; }
.cgk-post .alert-info { margin: 0 18px 10px; padding: 0; border: 0; background: none; font-size: 13px; color: var(--cg-discret-2); }
.cgk-post .kmessage-thankyou { padding: 0 18px 10px; font-size: 13px; color: var(--cg-discret); }
.cgk-post .kmessagepadding { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 14px 12px; margin: 0; border-top: 1px solid var(--cg-ligne); }
.cgk-post .kmessagepadding .btn { background: transparent; border-color: transparent !important; color: var(--cg-discret); font-weight: 500; }
.cgk-post .kmessagepadding .btn:hover, .cgk-post .kmessagepadding .btn:focus-visible { background: var(--cg-surface-2); color: var(--cg-texte); }
.cgk-post .kattach, .cgk-post > .card { margin: 0 18px 12px; }

/* Profil : onglets sur une ligne qui défile, colonnes d'informations en cartes de même hauteur. */
#kunena .nav-tabs { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
#kunena .nav-tabs .nav-link { white-space: nowrap; }
.view-user #kunena > .row { --bs-gutter-x: 12px; row-gap: 12px; }
.view-user #kunena > .row > [class*="col-"] > .list-group, .view-user #kunena > .row > [class*="col-"] > ul {
  background: var(--cg-surface); border-radius: var(--cg-rayon); box-shadow: var(--cg-ombre); overflow: hidden; }
/* Texte personnel du profil (blockquote) : une carte, pas une citation à liseré rouge. */
.view-user #kunena > .col-md-12 > blockquote { margin: 16px 0; padding: 16px 18px; border: 0; border-radius: var(--cg-rayon); background: var(--cg-surface); box-shadow: var(--cg-ombre); }
.view-user #kunena > .row .center img[width="144"] { border-radius: 50%; width: 120px; height: 120px; object-fit: cover; }

/* Mode sombre : les couleurs écrites en dur dans les anciens messages et blocs (bleu #0000cc, rouges foncés)
   deviennent lisibles ; les liens reprennent l'accent clair. */
html[data-theme="sombre"] #kunena .kmsg [style*="color"], html[data-theme="sombre"] #kunena [class*="col-"] [style*="color"] { color: var(--cg-texte) !important; }
html[data-theme="sombre"] #kunena .kmsg a[style*="color"], html[data-theme="sombre"] #kunena [class*="col-"] a[style*="color"] { color: var(--cg-accent-texte) !important; }
html[data-theme="sombre"] #kunena .kmsg [style*="background"] { background: transparent !important; }

/* Barre du forum : les catégories sont déjà dans la colonne de gauche et « Demander une config » dans l'en-tête du site. */
#kunena .navbar .item-101745, #kunena .navbar .item-101415, #kunena .navbar .item-101414,
#kunena .navbar .item-102121, #kunena .navbar .item-102122 { display: none; }
.cgk-post .report a, .cgk-post .report button, .cgk-post .report .btn { border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--cg-discret-2) !important; font-weight: 500; }

/* Téléphone : les lignes d'en-tête de tableau (« Catégorie », « Dernier message ») ne s'empilent plus. */
@media (max-width: 767px) { #kunena table tr:has(> th):not(:has(> td)), #kunena table tr:not([class]):has(> td > div.p-2) { display: none; } }

/* Recette du 22/10 (G8, G9). Mention « Propulsé par Kunena » : Kunena l'ajoute après #kunena et force son affichage
   (« #kunena + div { display: block !important } ») ; masquée par une règle plus précise, comme en prod. Titre h1 de la
   recherche avancée (override search/form). */
html body #kunena.layout + div[style*="text-align"] { display: none !important; }
#kunena.layout h1.cgk-titre-page { margin: 20px 0 14px; padding: 0; background: none; font-size: clamp(26px, 3vw, 34px); line-height: 1.1; color: var(--cg-texte); }