/*
Theme Name: Inspirations Digitales
Description: Thème enfant Divi sécurisé, modulaire et évolutif.
Author: Floriane M.
Template: Divi
Version: 2.0
*/

/* ===========================================================
   DESIGN SYSTEM — DIGITAL ORGANIQUE
=========================================================== */

:root {

  /* Couleurs principales */
  --color-white-soft: #FEFDFB;
  --color-lin-cream: #F8F5F0;
  --color-black-soft: #111111;
  --color-shadow-vegetal: #6B7B6E;
  --color-sage: #A8B9A3;
  --color-terra-deep: #A67C63;

  --color-cream-bg: #F0E8DE;
  --color-beige-sand: #D9C6B0;
  --color-beige-rose: #EDE4D9;
  --color-mint-pale: #C8D1C5;
  --color-terra-soft: #C9A78D;
  --color-terracotta-soft: #C89F89;
  --color-orange-accent: #E8A87C;
  --color-golden-light: #E8D5B7;

  --color-primary: #A8B5A2;
  --color-accent: #E8A87C;
  --color-bg-main: #F0E8DE;
  --color-text: #111111;

  --radius: 6px;
  --transition: 0.3s ease;
}

/* =========================================================
MENU MOBILE ANIM SLIDE Horizontal — DIVI
========================================================= */

/*
Animation slide depuis la droite.

IMPORTANT :
Ajouter la classe suivante
sur le Header / Section / Menu souhaité :

custom-mobile-slide

Cela permet d'activer ce style
uniquement là où nécessaire.
*/

/* -----------------------------------------
Animation d’ouverture du menu
----------------------------------------- */

.custom-mobile-slide .et_mobile_menu {

transform: translateX(100%);
transition: transform 0.3s ease;

}

/* -----------------------------------------
Menu ouvert (classe native Divi)
----------------------------------------- */

.custom-mobile-slide .mobile_nav.opened .et_mobile_menu {

transform: translateX(0);

}

/* -----------------------------------------
Position sous le header
----------------------------------------- */

.custom-mobile-slide .et_mobile_menu {

top: 80px !important; /* Adapter à la hauteur réelle du header */

position: fixed;

width: 100%;
height: calc(100vh - 80px);

}

/* -----------------------------------------
Fond du menu mobile
----------------------------------------- */

.custom-mobile-slide .et_mobile_menu {

background: #ffffff !important;

}

/* =========================================================
MENU MOBILE ANIM SLIDE BOTTOM — DIVI
========================================================= */

/*

/*
Animation slide vertiacal de bas en haut.

IMPORTANT :
Ajouter la classe suivante
sur le Header / Section / Menu souhaité :

custom-mobile-bottom

Cela permet d'activer ce style
uniquement là où nécessaire.
*/


/* ---------------------------------------------------------
   ANIMATION GLOBALE
--------------------------------------------------------- */

.custom-mobile-bottom .et_mobile_menu {

    position: fixed;
    left: 0;
    top: 80px !important;

    width: 100%;
    height: calc(100vh - 80px);

    background: #ffffff !important;

    z-index: 9999;

    overflow-y: auto;

    padding-top: 70px;

    box-shadow: 0 -10px 30px rgba(0,0,0,0.08);

    transform: translate3d(0,100%,0);
    opacity: 0;

    backface-visibility: hidden;
    will-change: transform, opacity;

    transition:
        transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.3s ease;

}

.custom-mobile-bottom .mobile_nav.opened .et_mobile_menu {

    transform: translate3d(0,0,0);
    opacity: 1;

}

/* ---------------------------------------------------------
   BOUTON FERMETURE
--------------------------------------------------------- */

.custom-mobile-close {

    position: absolute;

    top: 20px;
    right: 20px;

    background: transparent;

    border: none;

    font-size: 16px;

    font-weight: 600;

    color: #111111;

    cursor: pointer;

    z-index: 10000;

}

/* =========================================================
GUTENBERG — DERNIERS ARTICLES
========================================================= */

/*
Version simplifiée et robuste
pour le bloc Gutenberg :
"Derniers articles"
*/

/* -----------------------------------------
Liens
----------------------------------------- */

.wp-block-latest-posts a {

color: #111111 !important;

text-decoration: none !important;

transition: color 0.3s ease,
            text-decoration 0.3s ease;

border-left: 1px solid #A67C63;

border-radius: 5px;

padding-left: 10px;

}

/* -----------------------------------------
Hover
----------------------------------------- */

.wp-block-latest-posts a:hover {

color: #A67C63 !important;

text-decoration: underline !important;

}

/* -----------------------------------------
Liens visités
----------------------------------------- */

.wp-block-latest-posts a:visited {

color: #a8b9a3 !important;

font-style: oblique !important;

}




/* =========================================================
PAGINATION NUMÉROTÉE — BLOG PERSO
========================================================= */

/* -----------------------------------------
Conteneur pagination
----------------------------------------- */

.custom-pagination {

text-align: center;

margin-top: 20px;

}

/* -----------------------------------------
Liens + éléments pagination
----------------------------------------- */

.custom-pagination a,
.custom-pagination span {

display: inline-block;

margin: 0 5px;

padding: 8px 12px;

border: 1px solid #6B7B6E;

border-radius: 4px;

text-decoration: none;

color: #6B7B6E;

}

/* -----------------------------------------
Hover
----------------------------------------- */

.custom-pagination a {

background: #a8b9a375;

color: #a67c63;

border-color: #a8b9a375;

}

/* -----------------------------------------
Élément actif
----------------------------------------- */

.custom-pagination .current {

background: #a67c63;

color: #fff;

border-color: #a67c63;

}




/* =========================================================
PROTECTION GLOBALE DES IMAGES DU SITE
========================================================= */

/*
   Ce CSS :
   - empêche la sélection des images
   - bloque le drag & drop
   - désactive l’appui long sur mobile
   - limite la copie rapide des images
*/

/* -----------------------------------------
Protection globale des images
----------------------------------------- */
img {
    -webkit-user-drag: none;
    user-drag: none;

    -webkit-touch-callout: none;

    -webkit-user-select: none;
    user-select: none;

    pointer-events: none;
}