/* =================================================================== */
/* FICHIER CSS FINAL ET COMPLET - Fichier : assets/css/wpac-frontend.css */
/* Version 2.0.0                                                     */
/* =================================================================== */

/* --- STYLES GÉNÉRAUX --- */
#wpac-dashboard-app, #wpac-dashboard-app button, #wpac-dashboard-app input, #wpac-dashboard-app select, #wpac-dashboard-app a {
font-family: Arial, sans-serif !important;
}

/* --- STYLES DU BOUTON D'ENREGISTREMENT --- */
.wpac-save-button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 10px !important;
max-width: 280px !important;
width: 100% !important;
height: 50px !important;
padding: 0 24px !important;
border-radius: 9999px !important;
font-weight: 600 !important;
font-size: 1rem !important;
border: none !important;
cursor: pointer !important;
text-decoration: none !important;
transition: all 0.2s ease-in-out !important;
box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1) !important;
background-color: #FF0000;
color: #FFFFFF;
}
.wpac-save-button.is-saved {
background-color: #1a3249;
}
.wpac-save-button:hover {
transform: translateY(-2px);
box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1) !important;
}
.wpac-save-button svg {
width: 20px !important;
height: 20px !important;
}

/* --- STYLES POUR LES POP-UPS (MODALES) --- */
.wpac-modal-overlay {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
background-color: rgba(0, 0, 0, 0.6) !important;
display: none;
justify-content: center !important;
align-items: center !important;
z-index: 10000 !important;
transition: opacity 0.3s !important;
padding: 20px;
}
.wpac-modal-overlay.active {
display: flex !important;
}
.wpac-modal-content {
background-color: white !important;
padding: 30px !important;
border-radius: 12px !important;
width: 90% !important;
max-width: 500px !important;
text-align: center !important;
position: relative !important;
border: none !important;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
.wpac-modal-title {
font-size: 1.5rem !important;
font-weight: 600 !important;
margin-top: 0 !important;
margin-bottom: 20px !important;
color: #1f2937 !important;
}
.wpac-modal-button {
display: block !important;
width: 100% !important;
padding: 12px !important;
border-radius: 8px !important;
font-size: 1rem !important;
font-weight: 500 !important;
text-align: center !important;
text-decoration: none !important;
transition: background-color 0.2s !important;
margin-top: 10px !important;
cursor: pointer !important;
border: 1px solid transparent !important;
}
.wpac-modal-button.primary {
background-color: #295071 !important;
color: white !important;
}
.wpac-modal-button.primary:hover {
background-color: #1a3249 !important;
}
.wpac-modal-button.secondary {
background-color: #e5e7eb !important;
color: #1f2937 !important;
}
.wpac-modal-button.secondary:hover {
background-color: #d1d5db !important;
}
.wpac-modal-close {
position: absolute !important;
top: 10px !important;
right: 15px !important;
font-size: 2.5rem !important;
font-weight: bold !important;
font-family: Arial, sans-serif !important;
line-height: 1 !important;
color: #9ca3af !important;
background: none !important;
border: none !important;
border-radius: 0 !important;
width: auto !important;
height: auto !important;
padding: 5px !important;
cursor: pointer !important;
text-decoration: none;
}
.wpac-modal-close:hover {
color: #1f2937 !important;
}
.wpac-collection-select {
width: 100%;
padding: 12px;
border: 1px solid #d1d5db;
border-radius: 8px;
font-size: 1rem;
background-color: #f9fafb;
}

/* --- STYLES POUR LE TABLEAU DE BORD --- */
#wpac-dashboard-app .wpac-dashboard-container {
max-width: 1000px;
margin: 20px auto;
padding: 20px;
}
#wpac-dashboard-app .wpac-toolbar {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
gap: 10px;
}
.wpac-collections-tabs-new {
display: flex;
flex-wrap: wrap;
gap: 25px;
border-bottom: 1px solid #e0e0e0;
margin-bottom: 25px;
padding-left: 0;
}
.wpac-collections-tabs-new .wpac-collection-tab {
padding: 10px 4px;
margin-bottom: -1px;
cursor: pointer;
font-size: 1rem;
font-weight: 500;
color: #5f676d;
text-decoration: none;
border: none;
border-bottom: 3px solid transparent;
background: none;
transition: all 0.2s ease-in-out;
}
.wpac-collections-tabs-new .wpac-collection-tab:hover {
color: #295071;
}
.wpac-collections-tabs-new .wpac-collection-tab.active {
color: #295071;
font-weight: 600;
border-bottom: 3px solid #295071;
}
.wpac-collection-tab .wpac-article-count {
margin-left: 6px;
font-size: 0.9em;
color: inherit;
}
#wpac-dashboard-app .wpac-view-toggle a.wpac-view-icon {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 40px !important;
height: 40px !important;
text-decoration: none !important;
background-color: #FFFFFF !important;
color: #1f2937 !important;
border: 1px solid #d1d5db !important;
border-radius: 8px !important;
transition: background-color 0.2s !important;
}
#wpac-dashboard-app .wpac-view-toggle a.wpac-view-icon:hover {
background-color: #f0f0f0 !important;
}
#wpac-dashboard-app .wpac-view-toggle a.wpac-view-icon.active {
background-color: #D1D5DB !important;
border-color: #9ca3af !important;
}
#wpac-dashboard-app .wpac-create-collection input {
padding: 8px;
border-radius: 6px;
border: 1px solid #ccc;
width: 200px;
}
#wpac-dashboard-app .wpac-create-collection button {
padding: 8px 16px;
border-radius: 6px;
background-color: #295071;
color: white;
border: none;
transition: background-color 0.2s;
cursor: pointer;
}
#wpac-dashboard-app .wpac-create-collection button:hover {
background-color: #1a3249;
}
#wpac-dashboard-app .wpac-collection-content {
display: none;
margin-top: 2rem; /* Ajout pour l'espacement */
}
#wpac-dashboard-app .wpac-collection-content.active {
display: block;
}
#wpac-dashboard-app .wpac-collection-header {
    display: flex;
    flex-direction: column; /* On passe en mode colonne par défaut */
    align-items: flex-start; /* On aligne tout à gauche */
    gap: 15px; /* On ajoute de l'espace */
    margin-bottom: 1rem;
}
#wpac-dashboard-app .wpac-collection-header h2 {
font-size: 1.8rem;
font-weight: 600;
margin: 0;
}
#wpac-dashboard-app .wpac-collection-header-actions button {
margin-left: 8px;
padding: 8px 12px;
border-radius: 6px;
border:none;
color:white;
cursor:pointer;
}
#wpac-dashboard-app .wpac-collection-header-actions .wpac-summary-btn {
background-color: #295071;
}
#wpac-dashboard-app .wpac-collection-header-actions .wpac-delete-collection-btn {
background-color: #FF0000;
}
#wpac-dashboard-app .wpac-articles-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
}
#wpac-dashboard-app .wpac-view-grid .wpac-article-card {
width: calc(33.333% - 14px);
}
#wpac-dashboard-app .wpac-view-list .wpac-article-card {
width: 100%;
display: flex;
gap: 20px;
align-items: center;
}
#wpac-dashboard-app .wpac-article-card {
border: 1px solid #e5e7eb;
border-radius: 12px;
padding: 15px;
background: #fff;
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}
#wpac-dashboard-app .wpac-article-card img {
max-width: 100%;
border-radius: 8px;
object-fit: cover;
}
#wpac-dashboard-app .wpac-view-list .wpac-article-card img {
width: 150px;
height: 100px;
flex-shrink: 0;
}
#wpac-dashboard-app .wpac-article-card h3 a {
color: #1a1a1a;
text-decoration: none;
font-size: 1.2rem;
font-weight: 600;
}
#wpac-dashboard-app .wpac-excerpt {
font-size: 14px;
color: #6b7280;
line-height: 1.5;
margin: 10px 0;
}
#wpac-dashboard-app .wpac-meta {
font-size: 12px;
color: #9ca3af;
margin-bottom: 10px;
}
#wpac-dashboard-app .wpac-actions {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 15px;
padding-top: 15px;
border-top: 1px solid #f0f0f0;
gap: 10px;
}
#wpac-dashboard-app .wpac-actions select {
border: 1px solid #d1d5db;
background-color: #f9fafb;
color: #374151;
flex-grow: 1;
padding: 8px 12px;
border-radius: 8px;
font-size: 0.9rem;
}
#wpac-dashboard-app .wpac-actions .wpac-delete-icon-btn {
background-color: #FF0000 !important;
color: white !important;
border: none !important;
flex-shrink: 0;
width: 38px;
height: 38px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
cursor: pointer;
}
#wpac-dashboard-app .wpac-empty-message {
padding: 40px;
text-align: center;
color: #9ca3af;
width: 100%;
}

/* --- STYLES DU POP-UP DE RÉSUMÉ IA --- */
#wpac-summary-modal {
background-color: rgba(0, 0, 0, 0.7) !important;
z-index: 20000 !important;
}
#wpac-summary-modal-content {
max-height: 85vh;
overflow-y: auto;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
#wpac-summary-modal-content h3 {
font-size: 1.5rem !important;
}
#wpac-summary-modal-content #wpac-summary-text {
font-size: 1rem;
line-height: 1.6;
color: #374151;
white-space: pre-wrap;
text-align: left;
}

/* =================================================================== */
/* CORRECTIF FINAL ET DÉFINITIF POUR L'ICÔNE SVG DE LA POUBELLE     */
/* =================================================================== */
#wpac-dashboard-app .wpac-actions a.wpac-delete-icon-btn svg path {
    fill: white !important;
}
/* --- STYLES POUR LA DESCRIPTION DE COLLECTION --- */
.wpac-collection-title-wrapper {
    display: flex;
    flex-direction: column; /* Force les enfants (titre, description) à se superposer */
    align-items: flex-start; /* Aligne tout à gauche */
    gap: 5px; /* Petit espace entre le titre et la description */
    width: 100%;
}

.wpac-collection-description {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px;
    background-color: #f9fafb;
    border-radius: 6px;
    width: 100%; /* Occupe toute la largeur disponible */
}

.wpac-collection-description p {
    flex-grow: 1;
    margin: 0 !important;
    font-size: 0.9rem !important;
    color: #6b7280;
    line-height: 1.5 !important;
}

.wpac-collection-description p em {
    color: #9ca3af;
}

.wpac-edit-desc-btn {
    color: #9ca3af;
    flex-shrink: 0;
    transition: color 0.2s;
}

.wpac-edit-desc-btn:hover {
    color: #295071;
}

.wpac-collection-description textarea {
    width: 100%; /* Force la zone de texte à prendre toute la largeur */
    min-height: 80px;
    padding: 8px;
    border-radius: 6px;
    border: 1px solid #d1d5db;
    font-size: 0.9rem;
    line-height: 1.5;
}
/* --- RESPONSIVE POUR L'EN-TÊTE DE COLLECTION --- */
@media (max-width: 768px) {
    .wpac-collection-header {
        flex-direction: column; /* On passe en mode colonne */
        align-items: flex-start; /* On aligne tout à gauche */
        gap: 15px; /* On ajoute de l'espace entre le titre et les boutons */
    }

    .wpac-collection-header-actions {
        width: 100%; /* Les boutons prennent toute la largeur */
        display: flex;
        justify-content: flex-start; /* On les aligne à gauche */
        gap: 10px;
        margin-left: 0; /* On réinitialise la marge */
    }

    .wpac-collection-title-wrapper {
    width: 100%; /* On s'assure que le conteneur du titre prend toute la largeur */
}
}