/* Translog Africa — surcharges légères par-dessus le thème Solvior (doc/Template) */

.tj-logo-mark {
   height: 44px;
   width: 44px;
   border-radius: 50%;
   object-fit: cover;
   background: #fff;
   padding: 2px;
   margin-inline-end: 10px;
   vertical-align: middle;
}

.tj-text-logo {
   font-family: var(--tj-ff-heading, inherit);
   font-weight: 700;
   font-size: 24px;
   line-height: 1;
   color: var(--tj-color-heading-primary, #051229);
   letter-spacing: -0.02em;
}

.tj-text-logo span {
   color: var(--tj-color-theme-primary, #0075ff);
}

.header-2.header-absolute .tj-text-logo,
.hamburger_logo .tj-text-logo {
   color: #fff;
}

.header-2.header-absolute .tj-text-logo span,
.hamburger_logo .tj-text-logo span {
   color: var(--tj-color-theme-primary, #0075ff);
}

.footer2-col-1 .tj-text-logo {
   color: #fff;
}

/* Empty-state message shown when a data-driven section has no content yet */
.tj-empty-state {
   text-align: center;
   padding: 24px;
   color: var(--tj-color-text-body-2, #7e8590);
   font-style: italic;
}

.brand-logo img {
   max-height: 60px;
   width: auto;
   object-fit: contain;
}

/* Avatar fallback for speakers without an uploaded photo yet — initials on a
   gradient tile, sized to match the team-card image slot (or a small circle
   for inline mentions). Avoids showing a mismatched stock photo. */
.tj-avatar-fallback {
   width: 100%;
   aspect-ratio: 3 / 4;
   display: flex;
   align-items: center;
   justify-content: center;
   background: linear-gradient(135deg, var(--tj-color-theme-primary, #0075ff), var(--tj-color-theme-dark, #051229));
   color: #fff;
   font-size: 42px;
   font-weight: 700;
   letter-spacing: 0.05em;
}

.tj-avatar-fallback.tj-avatar-sm {
   width: 40px;
   height: 40px;
   aspect-ratio: 1 / 1;
   border-radius: 50%;
   font-size: 14px;
   flex-shrink: 0;
}

/* Actualités : un mot très long (URL, texte collé sans espace) ne doit jamais
   déborder de sa colonne, ni sur la fiche article ni sur les cartes de la liste. */
.tj-article-body,
.tj-post-title,
.sidebar-recent-post .title-link,
.blog-style-2 .blog-content .title,
.blog-style-2 .blog-content .desc {
   overflow-wrap: anywhere;
}

/* Chapô (extrait) en tête de l'article */
.tj-article-lead {
   font-size: 1.15em;
   font-weight: 500;
   color: var(--tj-color-heading-primary, #051229);
}

/* Cartes d'actualités : même format d'image pour toutes les cartes, quelle que
   soit la photo d'origine (paysage 4:3, 3:2, affiche 16:9...). */
.blog-style-2 .blog-images img {
   width: 100%;
   aspect-ratio: 3 / 2;
   object-fit: cover;
}

/* Formulaires : le template donne z-index 1 à chaque liste déroulante (nice-select),
   comme au bouton d'envoi qui la suit - la liste ouverte passait donc sous le bouton
   (et sous la liste déroulante suivante). Une liste ouverte passe au premier plan. */
.contact-form-one .nice-select.open {
   z-index: 10;
}

/* Carte de la page Contact en couleurs : le template la passe en niveaux de gris,
   ce qui la rendait illisible (routes et épingle du CBC peu visibles). */
.google-map iframe {
   -webkit-filter: none;
   filter: none;
}

/* Cartes d'intervenants avec une vraie photo : le template pose sur chaque carte un
   dégradé (.team-item::before) du transparent au bleu nuit qui assombrit toute la moitié
   basse de la photo. Pensé pour les tuiles d'initiales, il masque les vrais visages :
   on le retire ici, le bandeau nom/fonction (.team-content) reste lisible tout seul. */
.team-item.tj-team-photo::before {
   display: none;
}

/* Tuiles d'initiales alignées sur les cartes photo : dégradé bleu propre, initiales bien lisibles,
   et la hauteur suit le même format 3:4 que les photos (le bandeau nom/fonction se pose dessous). */
.tj-team-photo .tj-avatar-fallback {
   color: rgba(255, 255, 255, 0.92);
}

/* Photos d'intervenants : même format portrait 3:4 que les tuiles d'initiales, quel que soit
   le cadrage envoyé depuis le back-office (une photo paysage est recadrée au centre). */
.tj-team-photo .team-images img {
   aspect-ratio: 3 / 4;
   object-fit: cover;
   object-position: center top;
}

/* Page Participer : distance de chaque hôtel, en pastille alignée à gauche sous le nom.
   Une <div> et non un <p> : le template borne tout <p> d'une carte .contact-item.style-2
   à 224 px et le centre, ce qui coupait le texte. */
.tj-hotel-distance {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   margin-bottom: 16px;
   padding: 6px 14px;
   border-radius: 999px;
   background: rgba(0, 117, 255, 0.08);
   color: var(--tj-color-theme-primary, #0075ff);
   font-size: 15px;
   font-weight: 500;
   line-height: 1.4;
}

.tj-hotel-distance span {
   color: var(--tj-color-text-body, #3d4a5c);
}

/* Logo officiel Translog Africa 2026 (rond, nom et dates inclus) : remplace l'écusson CBC
   + texte dans l'en-tête, le menu mobile et le pied de page. */
.tj-brand-logo {
   height: 72px;
   width: 72px;
   display: block;
   object-fit: contain;
}

.hamburger_logo .tj-brand-logo {
   height: 60px;
   width: 60px;
}

.footer2-col-1 .tj-brand-logo {
   height: 110px;
   width: 110px;
}

/* Page À propos : avant-propos officiel du CBC, colonne de lecture centrée. */
.tj-avant-propos-image img {
   width: 100%;
   max-height: 460px;
   object-fit: cover;
   border-radius: 8px;
   margin-bottom: 36px;
}

.tj-avant-propos-text p {
   font-size: 18px;
   line-height: 1.85;
   margin-bottom: 22px;
}

.tj-avant-propos-text .tj-avant-propos-signature {
   margin-top: 32px;
   text-align: right;
   font-style: italic;
   font-weight: 600;
   color: var(--tj-color-heading-primary, #051229);
}

/* Médiathèque : édition (onglets) > événement (rubrique) > galerie de photos + cartes de documents. */
.tj-media-jump {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 10px;
   margin-bottom: 48px;
}

.tj-media-jump a {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   padding: 8px 16px;
   border: 1px solid var(--tj-color-border-2, #e3e8ef);
   border-radius: 999px;
   font-size: 15px;
   color: var(--tj-color-heading-primary, #051229);
   background: #fff;
}

.tj-media-jump a span {
   font-size: 12px;
   padding: 1px 8px;
   border-radius: 999px;
   background: rgba(0, 117, 255, 0.1);
   color: var(--tj-color-theme-primary, #0075ff);
}

.tj-media-jump a:hover {
   border-color: var(--tj-color-theme-primary, #0075ff);
   color: var(--tj-color-theme-primary, #0075ff);
}

.tj-media-collection {
   margin-bottom: 64px;
   scroll-margin-top: 110px;
}

.tj-media-collection-head {
   display: flex;
   flex-wrap: wrap;
   align-items: baseline;
   justify-content: space-between;
   gap: 6px 20px;
   padding-bottom: 14px;
   margin-bottom: 24px;
   border-bottom: 2px solid var(--tj-color-border-2, #e3e8ef);
}

.tj-media-collection-title {
   margin: 0;
   font-size: 26px;
}

.tj-media-counts {
   font-size: 14px;
   color: var(--tj-color-text-body-2, #7e8590);
}

.tj-media-gallery {
   margin-bottom: 8px;
}

.tj-media-photo {
   display: block;
   overflow: hidden;
   border-radius: 6px;
   aspect-ratio: 4 / 3;
   background: #e9edf3;
}

.tj-media-photo img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.4s ease;
}

.tj-media-photo:hover img {
   transform: scale(1.06);
}

.tj-media-resources {
   margin-top: 8px;
}

.tj-media-card {
   display: flex;
   gap: 16px;
   height: 100%;
   padding: 20px 22px;
   border: 1px solid var(--tj-color-border-2, #e3e8ef);
   border-radius: 8px;
   background: #fff;
}

.tj-media-card-icon {
   flex: 0 0 46px;
   width: 46px;
   height: 46px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background: rgba(0, 117, 255, 0.1);
   color: var(--tj-color-theme-primary, #0075ff);
   font-size: 18px;
}

.tj-media-card-title {
   margin: 0 0 6px;
   font-size: 18px;
   line-height: 1.35;
}

.tj-media-card-body p {
   margin-bottom: 10px;
   font-size: 15px;
}
