/* ============================================================
   EDocman Enhanced - Fichier CSS centralise

   Ce fichier contient toutes les variables CSS et les styles
   utilises par les templates EDocman Enhanced.

   Pour personnaliser, modifiez les variables :root ci-dessous
   ou overridez-les dans le CSS de votre template.
   ============================================================ */

/* === Variables CSS personnalisables === */
:root {
    /* Couleur principale (boutons, liens, accents).
       Suit la couleur du template ; on essaie plusieurs noms de variables
       (selon le theme/version : --maincolor, --secondary...) puis un fallback
       NEUTRE generique (gris fonce) -> reste reutilisable sur tout site. */
    --edocman-primary-color: var(--maincolor, var(--primary, #333333));
    --edocman-primary-hover: var(--maincolor-hover, #1a1a1a);

    /* Couleur secondaire : essaie --secondcolor, puis --secondarycolor,
       puis --secondary, sinon neutre. */
    --edocman-secondary-color: var(--secondcolor, var(--secondarycolor, var(--secondary, #555555)));
    --edocman-secondary-hover: var(--secondcolor-hover, #3a3a3a);

    /* Degrade du bouton principal, identique au bouton "Espace Membre" du theme :
       linear-gradient(84deg, <primaire> 0%, <secondaire> 100%).
       Reutilise les deux variables ci-dessus (donc memes fallbacks en cascade). */
    --edocman-primary-gradient: linear-gradient(84deg, var(--edocman-primary-color) 0%, var(--edocman-secondary-color) 100%);

    /* Couleur info (boutons neutres - style sppb-btn-info) */
    --edocman-info-bg: #F4F5F0;
    --edocman-info-hover: #e0e2d9;

    /* Couleurs de texte */
    --edocman-text-color: #4C4A46;
    --edocman-text-light: rgba(76, 74, 70, 0.5);
    --edocman-text-muted: rgba(76, 74, 70, 0.25);

    /* Police */
    --edocman-font-family: 'Poppins', sans-serif;

    /* Bordures */
    --edocman-border-color: rgba(109, 110, 112, 0.5);

    /* ============================================================
       HERO SECTION (page categories principales)
       --edocman-hero-display: block pour afficher, none pour masquer
       ============================================================ */
    --edocman-hero-display: none;
    --edocman-hero-bg: url('');
    --edocman-hero-height: 304px;
    --edocman-hero-overlay: rgba(0, 0, 0, 0.6);

    /* ============================================================
       LARGEUR PLEINE PAGE
       Pour utiliser la pleine largeur viewport (100vw), definir:
         --edocman-full-width: 100vw;
         --edocman-full-width-margin: calc(-50vw + 50%);
       Par defaut: 100% (largeur du conteneur parent)
       ============================================================ */
    --edocman-full-width: 100%;
    --edocman-full-width-margin: 0;

    /* ============================================================
       GRILLE DES CATEGORIES (page mediatheque)
       Nombre de colonnes desktop de la grille de categories.
       Doit etre un entier (utilise dans grid-template-columns: repeat()).
       Le responsive passe automatiquement a 2 puis 1 colonne (media queries).
       ============================================================ */
    --edocman-columns: 3;

    /* ============================================================
       BOUTONS - Border radius
       Valeurs possibles:
         0        = carre (comme sppb-btn sans modificateur)
         30px     = arrondi (comme sppb-btn-rounded)
         50%      = rond/cercle (comme sppb-btn-round)
       ============================================================ */
    --edocman-btn-border-radius: 30px;

    /* Module recherche */
    --edocman-search-bg: #6D6E70;
    /* Champ de saisie : fond + bordure (delimitent le champ sur fond blanc). */
    --edocman-search-field-bg: #F4F5F0;
    --edocman-search-border: #D9D9D9;

    /* Espacement haut de page */
    --edocman-page-top-padding: 0;

    /* Couleur de fond des pages */
    --edocman-page-bg: #FFFFFF;
}

/* ============================================================
   FOND BLANC POUR TOUTES LES PAGES EDOCMAN
   Empeche le fond du site Joomla de transparaitre
   ============================================================ */

/* Fond blanc sur toute la largeur de la page */
/* Fond blanc et overflow sur la section principale et le body */
body:has(.edocman-container),
body:has(#edocman-categories-page),
body:has(#edocman-category-page-table),
body:has(#edocman_form),
body:has(#edocmanSearchDiv) {
    overflow-x: hidden;
}

#sp-main-body:has(.edocman-container),
#sp-main-body:has(#edocman-categories-page),
#sp-main-body:has(#edocman-category-page-table),
#sp-main-body:has(#edocman_form),
#sp-main-body:has(#edocmanSearchDiv) {
    background-color: var(--edocman-page-bg);
    /* Neutralise le padding-top du template (#sp-main-body { padding: 100px 0 }).
       Pilotable via --edocman-page-top-padding (defaut 0). */
    padding-top: var(--edocman-page-top-padding, 0);
}

.edocman-container,
#edocman-categories-page,
#edocman-category-page-table,
#edocman_form,
#edocmanSearchDiv {
    background-color: var(--edocman-page-bg);
    min-height: 100vh;
}

/* Retirer le max-width du .container SP Page Builder quand il contient EDocman
   pour que le fond blanc et le search module occupent toute la largeur */
#sp-main-body > .container:has(.edocman-container),
#sp-main-body > .container:has(#edocman-categories-page),
#sp-main-body > .container:has(#edocman-category-page-table),
#sp-main-body > .container:has(#edocman_form),
#sp-main-body > .container:has(#edocmanSearchDiv) {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Conteneur EDocman : padding lateral pour le contenu */
.edocman-container,
#edocman-categories-page,
#edocman-category-page-table,
#edocman_form,
#edocmanSearchDiv {
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

/* Module de recherche : annule le padding parent pour occuper toute la largeur */
.edocman-search-module {
    margin-left: -15px;
    margin-right: -15px;
}

/* ============================================================
   STYLES POUR BOUTONS SPPB DANS EDOCMAN
   Override du border-radius des boutons sppb via variable CSS
   ============================================================ */

/* Bouton outline personnalise pour les cartes categories.
   !important sur les proprietes visuelles : les templates (Bootstrap, Helix,
   custom.css) definissent des regles .btn / a tres agressives, souvent en
   !important, qui ecrasent sinon le fond/bordure/couleur (bouton delave). */
.edocman-btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    font-family: var(--edocman-font-family);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    background: white !important;
    border: 2px solid var(--edocman-primary-color) !important;
    color: var(--edocman-primary-color) !important;
    border-radius: var(--edocman-btn-border-radius) !important;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
    line-height: 1.4;
}

.edocman-btn-outline:hover {
    background: var(--edocman-primary-color) !important;
    color: #FFFFFF !important;
    border-color: var(--edocman-primary-color) !important;
    text-decoration: none;
}

/* Override border-radius pour boutons sppb dans EDocman */
#edocman-categories-page .sppb-btn,
#edocman-category-page-table .sppb-btn,
#edocman_form .sppb-btn,
.edocman-container .sppb-btn {
    border-radius: var(--edocman-btn-border-radius) !important;
}

/* Style info pour boutons dans EDocman (fond gris clair) */
#edocman-categories-page .sppb-btn-info,
#edocman-category-page-table .sppb-btn-info,
#edocman_form .sppb-btn-info,
.edocman-container .sppb-btn-info {
    background: var(--edocman-info-bg) !important;
    border-color: var(--edocman-info-bg) !important;
    color: var(--edocman-text-color) !important;
}

#edocman-categories-page .sppb-btn-info:hover,
#edocman-category-page-table .sppb-btn-info:hover,
#edocman_form .sppb-btn-info:hover,
.edocman-container .sppb-btn-info:hover {
    background: var(--edocman-info-hover) !important;
    border-color: var(--edocman-info-hover) !important;
}

/* ============================================================
   BOUTONS "VOIR" / "TELECHARGER"
   Utilises dans la liste categorie (.edocman-doc-buttons) ET sur
   la page detail document (.primary-actions / .mobile-actions).
   .edocman-btn-view / .edocman-btn-download s'appuient sur les
   classes Bootstrap natives de Joomla (btn / btn-primary /
   btn-secondary) pour la taille et l'espacement, puis on force
   l'apparence ici pour un rendu identique quel que soit le
   template du site (independant de SP Page Builder / Helix).
   ============================================================ */

/* Bouton "Voir" : style neutre gris clair, texte fonce.
   padding 18px 35px = meme padding que le .sppb-btn-primary natif du
   template (bouton "Telecharger") pour que les deux boutons aient une
   taille identique sur les listes. */
.edocman-doc-buttons .edocman-btn-view,
.edocman-doc-buttons a.btn.edocman-btn-view,
a.btn.edocman-btn-view,
.edocman-document a.edocman-btn-view {
    padding: 18px 35px !important;
    background: var(--edocman-info-bg) !important;
    /* Bordure visible : le fond --edocman-info-bg (#F4F5F0) est quasi-blanc et
       invisible sur fond blanc ; la bordure delimite le bouton. */
    border: 1px solid var(--edocman-search-border, #D9D9D9) !important;
    color: var(--edocman-text-color) !important;
    border-radius: var(--edocman-btn-border-radius) !important;
    text-decoration: none;
}

.edocman-doc-buttons .edocman-btn-view:hover,
.edocman-doc-buttons a.btn.edocman-btn-view:hover,
.edocman-doc-buttons .edocman-btn-view:focus,
a.btn.edocman-btn-view:hover,
a.btn.edocman-btn-view:focus,
.edocman-document a.edocman-btn-view:hover,
.edocman-document a.edocman-btn-view:focus {
    background: var(--edocman-info-hover) !important;
    border-color: var(--edocman-info-hover) !important;
    color: var(--edocman-text-color) !important;
}

/* Bouton "Telecharger" : action principale. On force l'apparence ici
   (couleur primaire + texte blanc) au lieu de dependre de .sppb-btn-primary
   natif, qui est transparent par defaut sur certains templates SPPB et ne
   se revele qu'au hover -> le bouton paraissait invisible. La couleur suit
   --edocman-primary-color (liee a --maincolor du template).
   NB : on ne touche PAS au display / align-items / line-height ; le centrage
   vertical du texte est gere nativement par .btn / .sppb-btn (Bootstrap).
   C'est exactement le rendu du bouton de la liste de categorie. */
.edocman-doc-buttons .edocman-btn-download,
.edocman-doc-buttons a.btn.edocman-btn-download,
a.btn.edocman-btn-download,
.edocman-document a.edocman-btn-download {
    /* Meme rendu que le bouton "Espace Membre" du theme : degrade des
       couleurs du theme (--maincolor -> --secondcolor), texte blanc. */
    background: var(--edocman-primary-gradient) !important;
    border: 0 !important;
    color: #fff !important;
    border-radius: var(--edocman-btn-border-radius) !important;
    text-decoration: none;
}

.edocman-doc-buttons .edocman-btn-download:hover,
.edocman-doc-buttons a.btn.edocman-btn-download:hover,
.edocman-doc-buttons .edocman-btn-download:focus,
a.btn.edocman-btn-download:hover,
a.btn.edocman-btn-download:focus,
.edocman-document a.edocman-btn-download:hover,
.edocman-document a.edocman-btn-download:focus {
    /* Hover : meme degrade legerement assombri (independant des couleurs). */
    background: var(--edocman-primary-gradient) !important;
    filter: brightness(0.9);
    border: 0 !important;
    color: #fff !important;
}

/* ============================================================
   PAGINATION - centrage horizontal
   ============================================================ */
#edocman-category-page-table .pagination,
#edocman_form .pagination,
.edocman-container .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}