/**
* Theme Name: Atlas Child
* Description: This is a child theme of Atlas.
* Author: tmrwstudio
* Template: atlas
* Version: 1.0
*/

/* Centrage des publicités totem dans le sidebar */
.sidebar .widget-area img[width="300"],
.sidebar .widget-area iframe[width="300"],
.sidebar .widget-area div[style*="width: 300px"],
.sidebar .widget-area div[style*="width:300px"] {
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
}

/* Centrage pour les pubs 300x600 sur desktop/tablet */
@media (min-width: 768px) {
    .sidebar .widget-area img[width="300"],
    .sidebar .widget-area iframe[width="300"],
    .sidebar .widget-area div[style*="width: 300px"],
    .sidebar .widget-area div[style*="width:300px"] {
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
    }
}

/* Centrage pour les pubs 300x300 sur mobile */
@media (max-width: 767px) {
    .sidebar .widget-area img[width="300"],
    .sidebar .widget-area iframe[width="300"],
    .sidebar .widget-area div[style*="width: 300px"],
    .sidebar .widget-area div[style*="width:300px"] {
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
    }
}

/* Correction du scroll vertical parasite sur les conteneurs de catégories */
.elementor-element-847bfcd,
.elementor-element-9f32761 {
    overflow: visible !important;
}

/* Empêcher tout scroll non désiré sur les conteneurs flex */
.elementor-element-847bfcd > .e-con-inner,
.elementor-element-9f32761 > .e-con-inner {
    overflow: visible !important;
}

/* Correction plus complète du scroll parasite sur tous les conteneurs problématiques */
.elementor-76 .elementor-element-847bfcd,
.elementor-76 .elementor-element-9f32761,
.elementor-76 .elementor-element-847bfcd > .e-con-inner,
.elementor-76 .elementor-element-9f32761 > .e-con-inner,
.elementor-76 .elementor-element-847bfcd .e-con,
.elementor-76 .elementor-element-9f32761 .e-con {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Empêcher le scroll sur les colonnes individuelles des 3 blocs */
.elementor-76 .elementor-element-847bfcd .elementor-element,
.elementor-76 .elementor-element-9f32761 .elementor-element {
    overflow: visible !important;
}

/* S'assurer que les blocs enfants n'ont pas de hauteur fixe qui cause le scroll */
.elementor-76 .elementor-element-bbca08b,
.elementor-76 .elementor-element-49ce8ee,
.elementor-76 .elementor-element-0ccd770,
.elementor-76 .elementor-element-0e3e9da,
.elementor-76 .elementor-element-593f9e0 {
    overflow: visible !important;
    height: auto !important;
    min-height: 0 !important;
}


/* ============================================
   UX PHASE 1 - Widget "Les Plus Lus"
   Added: 2025-10-29
   ============================================ */

/* Conteneur principal du widget */
.tm-top-posts-widget {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* Header du widget */
.tm-widget-header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 3px solid #E63946;
}

.tm-widget-header h2 {
    font-size: 22px;
    font-weight: 700;
    color: #2B2D42;
    margin: 0;
    line-height: 1.2;
}

/* Liste des articles */
.tm-top-posts-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* Item article */
.tm-top-post-item {
    display: flex;
    gap: 12px;
    padding: 12px;
    border-radius: 8px;
    transition: all 0.3s ease;
    position: relative;
    background: #F8F9FA;
}

.tm-top-post-item:hover {
    background: #fff;
    box-shadow: 0 4px 12px rgba(230, 57, 70, 0.1);
    transform: translateX(5px);
}

/* Numéro de ranking */
.tm-post-rank {
    position: absolute;
    top: 8px;
    left: 8px;
    background: linear-gradient(135deg, #E63946, #F4A261);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 4px;
    line-height: 1;
    z-index: 2;
}

/* Top 3 avec couleurs spéciales */
.tm-top-post-item[data-rank="1"] .tm-post-rank {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.3);
}

.tm-top-post-item[data-rank="2"] .tm-post-rank {
    background: linear-gradient(135deg, #C0C0C0, #A9A9A9);
}

.tm-top-post-item[data-rank="3"] .tm-post-rank {
    background: linear-gradient(135deg, #CD7F32, #B8860B);
}

/* Miniature */
.tm-post-thumb {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.tm-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.tm-top-post-item:hover .tm-post-thumb img {
    transform: scale(1.1);
}

/* Contenu de l'article */
.tm-post-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding-top: 20px;
}

/* Titre */
.tm-post-title {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
}

.tm-post-title a {
    color: #2B2D42;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tm-post-title a:hover {
    color: #E63946;
}

/* Meta (vues) */
.tm-post-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tm-post-views {
    font-size: 12px;
    color: #666;
    font-weight: 500;
}

/* Ordre mobile - Widget APRÈS la pub */
@media (max-width: 767px) {
    .tm-top-posts-widget {
        order: 3;
    }

    /* La pub doit être en premier */
    .sidebar .widget-area > div:has([class*="ad"]),
    .sidebar .widget-area > div:has([id*="ad"]) {
        order: 1;
    }

    .tm-post-thumb {
        width: 70px;
        height: 70px;
    }

    .tm-post-title {
        font-size: 13px;
    }

    .tm-post-rank {
        font-size: 11px;
        padding: 3px 6px;
    }
}

/* Tablette */
@media (min-width: 768px) and (max-width: 1023px) {
    .tm-top-posts-widget {
        padding: 18px;
    }

    .tm-post-thumb {
        width: 75px;
        height: 75px;
    }
}

/* Animation d'apparition */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tm-top-post-item {
    animation: fadeInUp 0.5s ease forwards;
}

.tm-top-post-item:nth-child(1) { animation-delay: 0.1s; }
.tm-top-post-item:nth-child(2) { animation-delay: 0.2s; }
.tm-top-post-item:nth-child(3) { animation-delay: 0.3s; }
.tm-top-post-item:nth-child(4) { animation-delay: 0.4s; }
.tm-top-post-item:nth-child(5) { animation-delay: 0.5s; }

/* Centrage pub totem mobile homepage (2026-04-05) */
.terri-mobile-totem-accueil {
    text-align: center;
}
.terri-mobile-totem-accueil img {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

/* ================================================================
   NOS ÉDITIONS — category-magazine layout
   v1.0 — 2026-05-12
   ================================================================ */

/* Wrapper principal — aligné sur la largeur du site (--site_width = 1070px) */
.tm-ed-wrap {
    max-width: calc(var(--site_width) * 1px);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* ── FILTRES ──────────────────────────────────────────────────── */
.tm-ed-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}
.tm-ed-filter {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    background: #f0f0f0;
    color: #444;
    transition: background 0.2s, color 0.2s;
    border: none;
    cursor: pointer;
}
.tm-ed-filter:hover {
    background: #e0e0e0;
    color: #111;
    text-decoration: none;
}
.tm-ed-filter--active {
    background: var(--primary, #c0392b);
    color: #fff !important;
}
.tm-ed-filter--active:hover {
    opacity: .88;
}

/* Billboard au-dessus du hero */
.tm-ed-billboard {
    margin: 16px 0 24px;
    text-align: center;
    min-height: 1px;
}

/* ── HERO : dernier numéro ──────────────────────────────────── */
.tm-ed-hero {
    display: flex;
    gap: 36px;
    align-items: center;
    background: #f8f8f8;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 40px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

/* Couverture portrait à gauche */
.tm-ed-hero-cover {
    flex: 0 0 260px;
    display: block;
    overflow: hidden;
}
.tm-ed-hero-cover img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.tm-ed-hero-cover:hover img {
    transform: scale(1.03);
}

/* Infos à droite */
.tm-ed-hero-info {
    flex: 1;
    padding: 28px 28px 28px 0;
}
.tm-ed-hero-badge {
    display: inline-block;
    background: var(--primary, #c0392b);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    padding: 4px 12px;
    border-radius: 3px;
    margin-bottom: 12px;
}
.tm-ed-hero-title {
    font-size: 1.7rem;
    line-height: 1.25;
    margin: 0 0 12px;
}
.tm-ed-hero-title a {
    color: inherit;
    text-decoration: none;
}
.tm-ed-hero-title a:hover {
    opacity: .8;
}
.tm-ed-hero-excerpt {
    font-size: 0.95rem;
    color: #555;
    margin-bottom: 20px;
    line-height: 1.6;
}
.tm-ed-hero-excerpt p { margin: 0; }
.tm-ed-hero-btn {
    display: inline-block;
    background: var(--primary, #c0392b);
    color: #fff;
    padding: 10px 24px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: opacity 0.2s;
}
.tm-ed-hero-btn:hover {
    opacity: .85;
    color: #fff;
}

/* ── GRILLE + SIDEBAR ───────────────────────────────────────── */
.tm-ed-body {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 36px;
    align-items: start;
}

/* Titre section grille */
.tm-ed-grid-title {
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #888;
    font-weight: 600;
    margin: 0 0 20px;
    padding-bottom: 8px;
    border-bottom: 2px solid #eee;
}

/* Mosaïque 3 colonnes */
.tm-ed-grid-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

/* Carte numéro */
.tm-ed-card {
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(0,0,0,0.08);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.tm-ed-card:hover {
    box-shadow: 0 6px 20px rgba(0,0,0,0.14);
    transform: translateY(-2px);
}
.tm-ed-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
}
/* Couverture portrait dans la grille */
.tm-ed-card-cover {
    overflow: hidden;
    aspect-ratio: 2 / 3; /* couverture magazine portrait */
    background: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tm-ed-card-cover img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* couverture complète visible, sans recadrage */
    display: block;
    transition: transform 0.3s ease;
}
.tm-ed-card:hover .tm-ed-card-cover img {
    transform: scale(1.04);
}
.tm-ed-card-desc {
    padding: 10px 12px 14px;
}
.tm-ed-card-title {
    font-size: 0.82rem;
    margin: 0 0 4px;
    line-height: 1.3;
    font-weight: 600;
}
.tm-ed-card-date {
    font-size: 0.72rem;
    color: #999;
}

/* Sidebar totem pub */
.tm-ed-sidebar {
    position: sticky;
    top: 80px;
    text-align: center;
}

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width: 960px) {
    .tm-ed-body {
        grid-template-columns: 1fr;
    }
    .tm-ed-sidebar {
        position: static;
        order: -1; /* pub avant la grille sur mobile */
    }
    .tm-ed-grid-inner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 700px) {
    .tm-ed-hero {
        flex-direction: column;
        gap: 0;
    }
    .tm-ed-hero-cover {
        flex: none;
        width: 100%;
        max-height: 260px;
        overflow: hidden;
    }
    .tm-ed-hero-cover img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    .tm-ed-hero-info {
        padding: 20px;
    }
    .tm-ed-hero-title {
        font-size: 1.3rem;
    }
    .tm-ed-grid-inner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 420px) {
    .tm-ed-grid-inner {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
}


/* ================================================================
   SINGLE ARTICLE — masquer overlay titre/meta sur image featured
   2026-05-13
   ================================================================ */
/* Le titre/breadcrumb/meta apparaît en doublon (overlay image + contenu article).
   On masque l'overlay — la version dans le corps de l'article est conservée. */
.single-post .featured-hero .post-desc.desc-hero,
.single .featured-hero .post-desc.desc-hero {
    display: none !important;
}

/* Titre article sous l'image (non-magazine) — rendu par hook PHP */
.terri-post-header {
    padding: 20px 0 4px;
    border-bottom: 1px solid #eee;
    margin-bottom: 8px;
}
.terri-post-header .entry-header {
    padding: 0;
}
.terri-post-header .entry-title {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    line-height: 1.3;
    color: #111;
    margin-bottom: 10px;
}


/* ================================================================
   SINGLE MAGAZINE — couverture portrait centrée
   2026-05-13
   ================================================================ */
/* Sur les articles de la catégorie magazine, la featured image est
   une couverture portrait A4. On la contraint à max 320px centré
   au lieu du banner full-width par défaut du thème. */
.category-magazine.single .entry-featured,
.category-magazine.single .entry-featured .featured-hero {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 6px 28px rgba(0,0,0,0.18);
}

/* L'image remplit la boîte sans recadrage */
.category-magazine.single .featured-hero .thumb-container img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}
/* Supprimer le padding-bottom du thumb-container (ratio forcé par le thème) */
.category-magazine.single .featured-hero .thumb-container {
    padding-bottom: 0 !important;
    height: auto !important;
}

@media (max-width: 700px) {
    .category-magazine.single .entry-featured,
    .category-magazine.single .entry-featured .featured-hero {
        max-width: 240px;
    }
}

/* Badge Partenaire — test 2026-09-16 (David), forme identique aux tags par defaut (.entry-cats a.cat-btn) */
.tm-badge-partenaire {
	display: inline-block;
	border-radius: var(--box-radius);
	background-color: #0C6291;
	color: #ffffff;
	padding: 2px 6px;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 13px;
	margin-bottom: 8px;
}

/* Badge Publi-reportage — 2026-09-17 (demande client), meme forme que .tm-badge-partenaire
   mais couleur Terraccota #B57352 (charte : "accents chauds, promotions") pour rester
   visuellement distinct du badge Partenariat. Les deux peuvent cohabiter sur un meme article. */
.tm-badge-publireportage {
	display: inline-block;
	border-radius: var(--box-radius);
	background-color: #B57352;
	color: #ffffff;
	padding: 2px 6px;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 13px;
	margin-bottom: 8px;
	margin-right: 6px;
}

/* Correctif 2026-09-18 : le mode "modern" du theme parent affiche toujours la
   date accolee au nom d'auteur dans .meta-modern-desc, meme quand l'argument
   'date' est desactive (qui ne controle que le badge separe .meta-item.meta-date).
   Masque cette date residuelle sur les articles redactionnels classiques
   (classe .entry-header-nodate posee par article-title.php), sans toucher
   aux articles RSS partenaires qui gardent leur date visible partout. */
.entry-header-nodate .meta-modern-desc span.info-text {
	display: none;
}