@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

#articles,
#articlereformes,
#actualites,
#economie-finance,
#conseil-des-ministres,
#sociale ,
#recherche {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: #F8FAFC;
    color: #111827;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#articles .page-band,
#articlereformes .page-band,
#actualites .page-band,
#economie-finance .page-band,
#conseil-des-ministres .page-band,
#sociale .page-band ,
#recherche .page-band {
    background: #FFFFFF;
    border-bottom: 1px solid #E5E7EB;
    padding: 40px 0 32px;
}

#articles .page-band h1,
#articlereformes .page-band h1,
#actualites .page-band h1,
#economie-finance .page-band h1,
#conseil-des-ministres .page-band h1,
#sociale .page-band h1 ,
#recherche .page-band h1 {
    font-size: 2rem;
    font-weight: 800;
    color: #111827;
    margin: 0;
    letter-spacing: -0.03em;
}

#articles .page-body,
#articlereformes .page-body,
#actualites .page-body,
#economie-finance .page-body,
#conseil-des-ministres .page-body,
#sociale .page-body ,
#recherche .page-body {
    /* Haut et bas seulement : « padding: 40px 0 80px » annulait les marges
       latérales du .container, collant tout le contenu aux bords sur mobile. */
    padding-top: 40px;
    padding-bottom: 80px;
}

#articles .search-input-group,
#articlereformes .search-input-group,
#actualites .search-input-group,
#economie-finance .search-input-group,
#conseil-des-ministres .search-input-group,
#sociale .search-input-group ,
#recherche .search-input-group {
    max-width: 100%;
    margin: 0 auto 32px;
    position: relative;
    display: flex;
    align-items: stretch;
    background: #FFFFFF;
    border-radius: 18px;
    border: 2px solid #E5E7EB;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: all 0.2s ease;
    overflow: hidden;
}

#articles .search-input-group:focus-within,
#articlereformes .search-input-group:focus-within,
#actualites .search-input-group:focus-within,
#economie-finance .search-input-group:focus-within,
#conseil-des-ministres .search-input-group:focus-within,
#sociale .search-input-group:focus-within ,
#recherche .search-input-group:focus-within {
    border-color: #DC2626;
    box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.1), 0 4px 12px rgba(0, 0, 0, 0.08);
}

#articles .search_input,
#articlereformes .search_input,
#actualites .search_input,
#economie-finance .search_input,
#conseil-des-ministres .search_input,
#sociale .search_input ,
#recherche .search_input {
    border-radius: 18px 0 0 18px !important;
    border: none !important;
    background: transparent !important;
    padding: 18px 24px !important;
    font-size: 1rem !important;
    flex: 1;
    box-shadow: none !important;
    outline: none !important;
    min-width: 0;
    color: #111827;
}

#articles .search_input:focus,
#articlereformes .search_input:focus,
#actualites .search_input:focus,
#economie-finance .search_input:focus,
#conseil-des-ministres .search_input:focus,
#sociale .search_input:focus ,
#recherche .search_input:focus {
    box-shadow: none !important;
    outline: none !important;
}

#articles .search_icon,
#articlereformes .search_icon,
#actualites .search_icon,
#economie-finance .search_icon,
#conseil-des-ministres .search_icon,
#sociale .search_icon ,
#recherche .search_icon {
    border-radius: 0 18px 18px 0;
    background: #DC2626;
    border: none;
    padding: 18px 28px;
    transition: all 0.2s ease;
    font-weight: 600;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    color: #FFFFFF;
    cursor: pointer;
    margin-left: 0;
    box-shadow: none;
    outline: none;
}

#articles .search_icon:hover,
#articlereformes .search_icon:hover,
#actualites .search_icon:hover,
#economie-finance .search_icon:hover,
#conseil-des-ministres .search_icon:hover,
#sociale .search_icon:hover ,
#recherche .search_icon:hover {
    background: #B91C1C;
}

#articles .search_icon:focus,
#articlereformes .search_icon:focus,
#actualites .search_icon:focus,
#economie-finance .search_icon:focus,
#conseil-des-ministres .search_icon:focus,
#sociale .search_icon:focus ,
#recherche .search_icon:focus {
    outline: none;
    box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.15);
}

#articles .dropdown-container,
#articlereformes .dropdown-container,
#actualites .dropdown-container,
#economie-finance .dropdown-container,
#conseil-des-ministres .dropdown-container,
#sociale .dropdown-container ,
#recherche .dropdown-container {
    display: flex;
    gap: 16px;
    margin-bottom: 32px;
    flex-wrap: wrap;
}

#articles .dropdown,
#articlereformes .dropdown,
#actualites .dropdown,
#economie-finance .dropdown,
#conseil-des-ministres .dropdown,
#sociale .dropdown ,
#recherche .dropdown {
    flex: 1;
    min-width: 200px;
    position: relative;
    z-index: 1000;
}

#articles .dropdown-toggle,
#articlereformes .dropdown-toggle,
#actualites .dropdown-toggle,
#economie-finance .dropdown-toggle,
#conseil-des-ministres .dropdown-toggle,
#sociale .dropdown-toggle ,
#recherche .dropdown-toggle {
    width: 100%;
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    background: #FFFFFF;
    color: #374151;
    padding: 12px 16px;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#articles .dropdown-toggle:hover,
#articlereformes .dropdown-toggle:hover,
#actualites .dropdown-toggle:hover,
#economie-finance .dropdown-toggle:hover,
#conseil-des-ministres .dropdown-toggle:hover,
#sociale .dropdown-toggle:hover ,
#recherche .dropdown-toggle:hover {
    border-color: #DC2626;
    color: #DC2626;
    background: #FFFFFF;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.06);
}

#articles .dropdown-toggle::after,
#articlereformes .dropdown-toggle::after,
#actualites .dropdown-toggle::after,
#economie-finance .dropdown-toggle::after,
#conseil-des-ministres .dropdown-toggle::after,
#sociale .dropdown-toggle::after ,
#recherche .dropdown-toggle::after {
    border-top-color: #6B7280;
    border-bottom-color: #6B7280;
    margin-left: 8px;
}

#articles .dropdown-menu,
#articlereformes .dropdown-menu,
#actualites .dropdown-menu,
#economie-finance .dropdown-menu,
#conseil-des-ministres .dropdown-menu,
#sociale .dropdown-menu ,
#recherche .dropdown-menu {
    width: 100%;
    border-radius: 14px;
    border: 1px solid #E5E7EB;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
    padding: 8px;
    min-width: 100%;
    background: #FFFFFF;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    z-index: 9999;
    margin-top: 8px;
}

#articles .dropdown-item,
#articlereformes .dropdown-item,
#actualites .dropdown-item,
#economie-finance .dropdown-item,
#conseil-des-ministres .dropdown-item,
#sociale .dropdown-item ,
#recherche .dropdown-item {
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 0.88rem;
    color: #374151;
    transition: all 0.15s ease;
    margin-bottom: 2px;
}

#articles .dropdown-item:hover,
#articlereformes .dropdown-item:hover,
#actualites .dropdown-item:hover,
#economie-finance .dropdown-item:hover,
#conseil-des-ministres .dropdown-item:hover,
#sociale .dropdown-item:hover ,
#recherche .dropdown-item:hover {
    background: #F9FAFB;
    color: #DC2626;
}

#articles .dropdown-item.disabled,
#articlereformes .dropdown-item.disabled,
#actualites .dropdown-item.disabled,
#economie-finance .dropdown-item.disabled,
#conseil-des-ministres .dropdown-item.disabled,
#sociale .dropdown-item.disabled ,
#recherche .dropdown-item.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

#articles #reset-filters,
#articlereformes #reset-filters,
#actualites #reset-filters,
#economie-finance #reset-filters,
#conseil-des-ministres #reset-filters,
#sociale #reset-filters ,
#recherche #reset-filters {
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    background: #FFFFFF;
    color: #374151;
    padding: 12px 20px;
    font-weight: 500;
    transition: all 0.2s ease;
    align-self: center;
}

#articles #reset-filters:hover,
#articlereformes #reset-filters:hover,
#actualites #reset-filters:hover,
#economie-finance #reset-filters:hover,
#conseil-des-ministres #reset-filters:hover,
#sociale #reset-filters:hover ,
#recherche #reset-filters:hover {
    border-color: #DC2626;
    color: #DC2626;
    background: #FFFFFF;
}

#articles .table-container,
#articlereformes .table-container,
#actualites .table-container,
#economie-finance .table-container,
#conseil-des-ministres .table-container,
#sociale .table-container ,
#recherche .table-container {
    background: #FFFFFF;
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    border: 1px solid #E5E7EB;
}

#articles .article-card,
#articlereformes .article-card,
#actualites .article-card,
#economie-finance .article-card,
#conseil-des-ministres .article-card,
#sociale .article-card ,
#recherche .article-card {
    transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease;
    height: 100%;
    margin-bottom: 24px;
}

#articles .article-card .card,
#articlereformes .article-card .card,
#actualites .article-card .card,
#economie-finance .article-card .card,
#conseil-des-ministres .article-card .card,
#sociale .article-card .card ,
#recherche .article-card .card {
    border-radius: 20px;
    border: 1px solid #E5E7EB;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
    overflow: hidden;
    height: 100%;
    background: #FFFFFF;
}

#articles .article-card:hover .card,
#articlereformes .article-card:hover .card,
#actualites .article-card:hover .card,
#economie-finance .article-card:hover .card,
#conseil-des-ministres .article-card:hover .card,
#sociale .article-card:hover .card ,
#recherche .article-card:hover .card {
    transform: translateY(-8px);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.12), 0 8px 24px rgba(0, 0, 0, 0.06);
    border-color: #DC2626;
}

#articles .article-card .card-img-top,
#articlereformes .article-card .card-img-top,
#actualites .article-card .card-img-top,
#economie-finance .article-card .card-img-top,
#conseil-des-ministres .article-card .card-img-top,
#sociale .article-card .card-img-top ,
#recherche .article-card .card-img-top {
    height: 220px;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
    display: block;
    width: 100%;
}

#articles .article-card:hover .card-img-top,
#articlereformes .article-card:hover .card-img-top,
#actualites .article-card:hover .card-img-top,
#economie-finance .article-card:hover .card-img-top,
#conseil-des-ministres .article-card:hover .card-img-top,
#sociale .article-card:hover .card-img-top ,
#recherche .article-card:hover .card-img-top {
    transform: scale(1.06);
}

#articles .card-title,
#articlereformes .card-title,
#actualites .card-title,
#economie-finance .card-title,
#conseil-des-ministres .card-title,
#sociale .card-title ,
#recherche .card-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.4;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    letter-spacing: -0.003em;
}

#articles .card-title a,
#articlereformes .card-title a,
#actualites .card-title a,
#economie-finance .card-title a,
#conseil-des-ministres .card-title a,
#sociale .card-title a ,
#recherche .card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

#articles .card-title a:hover,
#articlereformes .card-title a:hover,
#actualites .card-title a:hover,
#economie-finance .card-title a:hover,
#conseil-des-ministres .card-title a:hover,
#sociale .card-title a:hover ,
#recherche .card-title a:hover {
    color: #DC2626;
}

#articles .card-date,
#articlereformes .card-date,
#actualites .card-date,
#economie-finance .card-date,
#conseil-des-ministres .card-date,
#sociale .card-date ,
#recherche .card-date {
    font-size: 0.8rem;
    color: #9CA3AF;
    font-weight: 500;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid #E5E7EB;
}

#articles #articles_count,
#articlereformes #articles_count,
#actualites #articles_count,
#economie-finance #articles_count,
#conseil-des-ministres #articles_count,
#sociale #articles_count ,
#recherche #articles_count {
    color: #6B7280;
    font-size: 0.9rem;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #E5E7EB;
}

#articles #total_articles,
#articlereformes #total_articles,
#actualites #total_articles,
#economie-finance #total_articles,
#conseil-des-ministres #total_articles,
#sociale #total_articles ,
#recherche #total_articles {
    color: #374151;
    font-weight: 600;
    font-size: 0.9rem;
}

#articles .pagination,
#articlereformes .pagination,
#actualites .pagination,
#economie-finance .pagination,
#conseil-des-ministres .pagination,
#sociale .pagination ,
#recherche .pagination {
    gap: 8px;
    justify-content: center;
    margin-top: 40px;
    flex-wrap: wrap;
}

#articles .pagination .page-link,
#articlereformes .pagination .page-link,
#actualites .pagination .page-link,
#economie-finance .pagination .page-link,
#conseil-des-ministres .pagination .page-link,
#sociale .pagination .page-link ,
#recherche .pagination .page-link {
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    color: #374151;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.2s ease;
    margin: 0 3px;
    background: #FFFFFF;
    min-width: 40px;
    text-align: center;
    padding: 8px 12px;
}

#articles .pagination .page-item.active .page-link,
#articlereformes .pagination .page-item.active .page-link,
#actualites .pagination .page-item.active .page-link,
#economie-finance .pagination .page-item.active .page-link,
#conseil-des-ministres .pagination .page-item.active .page-link,
#sociale .pagination .page-item.active .page-link ,
#recherche .pagination .page-item.active .page-link {
    background: #DC2626;
    border-color: #DC2626;
    color: #FFFFFF;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.2);
}

#articles .pagination .page-link:hover,
#articlereformes .pagination .page-link:hover,
#actualites .pagination .page-link:hover,
#economie-finance .pagination .page-link:hover,
#conseil-des-ministres .pagination .page-link:hover,
#sociale .pagination .page-link:hover ,
#recherche .pagination .page-link:hover {
    background: #DC2626;
    border-color: #DC2626;
    color: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.2);
}

#articles #no-results-message,
#articlereformes #no-results-message,
#actualites #no-results-message,
#economie-finance #no-results-message,
#conseil-des-ministres #no-results-message,
#sociale #no-results-message ,
#recherche #no-results-message {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    border: 1px solid #E5E7EB;
}

#articles .text-center,
#articlereformes .text-center,
#actualites .text-center,
#economie-finance .text-center,
#conseil-des-ministres .text-center,
#sociale .text-center ,
#recherche .text-center {
    color: #6B7280;
    font-size: 0.9rem;
}

@media (max-width: 768px) {
    #articles .page-band,
    #articlereformes .page-band,
    #actualites .page-band,
    #economie-finance .page-band,
    #conseil-des-ministres .page-band,
    #sociale .page-band ,
    #recherche .page-band {
        padding: 24px 0 20px;
    }

    #articles .page-band h1,
    #articlereformes .page-band h1,
    #actualites .page-band h1,
    #economie-finance .page-band h1,
    #conseil-des-ministres .page-band h1,
    #sociale .page-band h1 ,
    #recherche .page-band h1 {
        font-size: 1.5rem;
    }

    #articles .table-container,
    #articlereformes .table-container,
    #actualites .table-container,
    #economie-finance .table-container,
    #conseil-des-ministres .table-container,
    #sociale .table-container ,
    #recherche .table-container {
        padding: 20px;
        border-radius: 16px;
    }

    #articles .dropdown-container,
    #articlereformes .dropdown-container,
    #actualites .dropdown-container,
    #economie-finance .dropdown-container,
    #conseil-des-ministres .dropdown-container,
    #sociale .dropdown-container ,
    #recherche .dropdown-container {
        flex-direction: column;
    }

    #articles .dropdown,
    #articlereformes .dropdown,
    #actualites .dropdown,
    #economie-finance .dropdown,
    #conseil-des-ministres .dropdown,
    #sociale .dropdown ,
    #recherche .dropdown {
        min-width: 100%;
    }

    #articles .dropdown-toggle,
    #articlereformes .dropdown-toggle,
    #actualites .dropdown-toggle,
    #economie-finance .dropdown-toggle,
    #conseil-des-ministres .dropdown-toggle,
    #sociale .dropdown-toggle ,
    #recherche .dropdown-toggle {
        width: 100%;
    }

    #articles .search-input-group,
    #articlereformes .search-input-group,
    #actualites .search-input-group,
    #economie-finance .search-input-group,
    #conseil-des-ministres .search-input-group,
    #sociale .search-input-group ,
    #recherche .search-input-group {
        flex-direction: column;
    }

    #articles .search_input,
    #articlereformes .search_input,
    #actualites .search_input,
    #economie-finance .search_input,
    #conseil-des-ministres .search_input,
    #sociale .search_input ,
    #recherche .search_input {
        border-radius: 18px 18px 0 0;
    }

    #articles .search_icon,
    #articlereformes .search_icon,
    #actualites .search_icon,
    #economie-finance .search_icon,
    #conseil-des-ministres .search_icon,
    #sociale .search_icon ,
    #recherche .search_icon {
        border-radius: 0 0 18px 18px;
    }
}

#articles .article-card .card-img-top-wrapper,
#articlereformes .article-card .card-img-top-wrapper,
#actualites .article-card .card-img-top-wrapper,
#economie-finance .article-card .card-img-top-wrapper,
#conseil-des-ministres .article-card .card-img-top-wrapper,
#sociale .article-card .card-img-top-wrapper ,
#recherche .article-card .card-img-top-wrapper {
    overflow: hidden;
    height: 220px;
    position: relative;
    background: #F3F4F6;
}

#articles .article-card .card-img-top-wrapper a,
#articlereformes .article-card .card-img-top-wrapper a,
#actualites .article-card .card-img-top-wrapper a,
#economie-finance .article-card .card-img-top-wrapper a,
#conseil-des-ministres .article-card .card-img-top-wrapper a,
#sociale .article-card .card-img-top-wrapper a ,
#recherche .article-card .card-img-top-wrapper a {
    display: block;
}

#articles .card-img-top-wrapper img,
#articlereformes .card-img-top-wrapper img,
#actualites .card-img-top-wrapper img,
#economie-finance .card-img-top-wrapper img,
#conseil-des-ministres .card-img-top-wrapper img,
#sociale .card-img-top-wrapper img ,
#recherche .card-img-top-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
    display: block;
}

#articles .article-card:hover .card-img-top-wrapper img,
#articlereformes .article-card:hover .card-img-top-wrapper img,
#actualites .article-card:hover .card-img-top-wrapper img,
#economie-finance .article-card:hover .card-img-top-wrapper img,
#conseil-des-ministres .article-card:hover .card-img-top-wrapper img,
#sociale .article-card:hover .card-img-top-wrapper img ,
#recherche .article-card:hover .card-img-top-wrapper img {
    transform: scale(1.06);
}

/* Téléphone : recherche sur une ligne, plus de cadre autour de la grille
   (les cartes étaient enfermées dans une seconde carte), filtres compacts. */
@media (max-width: 767.98px) {
    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .page-body {
        padding-top: 24px;
        padding-bottom: 48px;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .search-input-group {
        flex-direction: row;
        border-radius: 12px;
        border-width: 1px;
        margin-bottom: 16px;
        box-shadow: none;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .search_input {
        padding: 14px 16px !important;
        font-size: 16px !important;
        border-radius: 12px 0 0 12px !important;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .search_icon {
        padding: 0 20px;
        border-radius: 0;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .dropdown-container {
        gap: 8px;
        margin-top: 0 !important;
        margin-bottom: 20px;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .dropdown-toggle {
        padding: 12px 14px;
        box-shadow: none;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .dropdown-toggle .badge {
        margin-left: auto !important;
        margin-right: 10px;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .table-container {
        padding: 0;
        background: transparent;
        border: none;
        box-shadow: none;
        border-radius: 0;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .article-card .card-img-top-wrapper,
    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .article-card .card-img-top {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .article-card .card {
        border-radius: 14px;
    }

    :is(#articles, #articlereformes, #actualites, #economie-finance, #conseil-des-ministres, #sociale, #recherche) .article-card:hover .card {
        transform: none;
    }
}