/*
 Theme Name:     MZOR CHILD
 Description:    Thème enfant de mzor
 Author:         Nuna
 Author URI:     https://www.luniversdenuna.com
 Template:       hello-elementor
 Version:        0.1.0
*/

/* Espace sous le header fixe (bandeau + logo + menu) */
body {
  padding-top: 350px;
}


/* ========================= */
/* BANDEAU TEXTE DÉFILANT    */
/* ========================= */

.lw-scrolling-bar {
  display: flex;
  align-items: center;
  top: 0;
  width: 100%;
  overflow: hidden;
  font-family: inherit;
  min-height: 40px;
  /* tu peux enlever height si tu veux que ça s’ajuste automatiquement :
  height: 40px;
  */
  background: #a31922;
  border-radius: 0;
  position: relative;
  z-index: 1; /* passe au-dessus du fond du header */
}

.lw-scrolling-text {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
}

.lw-scrolling-text .lw-inner {
  display: inline-block;
  white-space: nowrap;
  animation: lw-scroll 15s linear infinite;
}

.lw-scrolling-text .lw-inner span {
  display: inline-block;
  margin-right: 3rem;
  color: #E3DCC2;
  font-size: 16px;
  font-weight: 700;
}

@keyframes lw-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.lw-scrolling-text:hover .lw-inner {
  animation-play-state: paused !important;
}

/* ========================= */
/* HEADER MZOR FIXE + LOGO   */
/* ========================= */

/* Conteneur général du header (bandeau + logo + menu) */
.mzor-header.banner-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  overflow: visible !important;
  display: flex;
  flex-direction: column;  /* bandeau au-dessus, header-main en dessous */
}

/* Conteneur logo + menu : état initial (page en haut) */
.mzor-header-main {
  display: flex;
  flex-direction: column;      /* logo + menu l'un sous l'autre */
  align-items: center;         /* centré */
  gap: 0.4rem;
  padding: 0.6rem 1.5rem;
  transition: all 0.3s ease;
  overflow: visible !important;
  background: rgba(0, 0, 0, 0.55);  /* noir avec 35% d'opacité */
  transition: background 0.3s ease, backdrop-filter 0.3s ease;
  backdrop-filter: blur(4px);       /* optionnel : effet léger "verre dépoli" */
}


/* LOGOS */
.mzor-logo-big img,
.mzor-logo-small img {
  display: block;
  height: auto;
  transition: all 0.3s ease;
}

/* Au début : on montre le grand logo, on cache le petit */
.mzor-logo-big {
  display: block;
}
.mzor-logo-small {
  display: none;
  padding-top: 10px;
}

/* Menu */
.mzor-menu {
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: visible !important; /* le menu déroulant peut dépasser */
  position: relative;
  z-index: 10000; /* au-dessus du reste du header */
}

/* Quand le header est en mode "scrolled" */
body.header-scrolled .mzor-header-main {
  flex-direction: row;             /* logo + menu sur une ligne */
  justify-content: space-between;
  align-items: center;
  padding: 0.3rem 1.5rem;          /* header plus compact */
  background: #000000;        /* noir plein */
  backdrop-filter: none;      /* on enlève le blur si tu l'avais */
}

/* On bascule les logos */
body.header-scrolled .mzor-logo-big {
  display: none;
}
body.header-scrolled .mzor-logo-small {
  display: block;
}

/* Petit logo à gauche, plus petit */
body.header-scrolled .mzor-logo-small img {
  max-height: 60px; /* à ajuster selon ton visuel */
}

/* Menu collé à droite, aligné horizontalement */
body.header-scrolled .mzor-menu {
  justify-content: flex-end;
}

/* Forcer le dropdown à passer au-dessus du contenu */
.mzor-menu .elementor-nav-menu--dropdown,
.mzor-header .elementor-nav-menu--dropdown {
  position: absolute;
  z-index: 10001;
}

/* ========================= */
/* MENU SMALL-TOUTES LES PAGES */
/* ========================= */

/* Sur TOUTES les pages qui NE sont PAS la home */
body:not(.home) .mzor-logo-big {
  display: none;
}

body:not(.home) .mzor-logo-small {
  display: block;
}

body:not(.home) .mzor-header-main {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0.3rem 1.5rem;
}

/* même logique que header-scrolled pour le menu */
body:not(.home) .mzor-menu {
  justify-content: flex-end;
}

/* taille du small logo */
body:not(.home) .mzor-logo-small img {
  max-height: 40px; /* adapte si besoin */
}

/* PADDING-TOP NORMAL (BIG HEADER) POUR LA HOME */
body.home {
  padding-top: 350px; /* valeur déjà utilisée */
}

/* PADDING-TOP RÉDUIT POUR LES AUTRES PAGES */
body:not(.home) {
  padding-top: 50px; /* valeur à ajuster selon la hauteur du small header */
}


/* ========================= */
/* CARROUSEL ACCUEIL           */
/* ========================= */

/* adapter l'overlay sur le carrousel' */

.carousel-overlay {
  position: relative;
  overflow: hidden; /* pour que le voile ne déborde pas */
}

.carousel-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.65); /* intensité du voile : 0.45 = 45% */
  z-index: 5; /* au-dessus du carrousel */
  pointer-events: none; /* le carrousel reste cliquable */
}

/* CONTENEUR GLOBAL DU HERO CARROUSEL */
.hero-carousel {
  position: relative;
  overflow: hidden;
  min-height: 30px;          /* hauteur mini de ton bloc, à ajuster */
  display: flex;
  align-items: center;        /* centre verticalement le contenu */
}

/* CARROUSEL EN ARRIÈRE-PLAN */
.hero-carousel-bg {
  position: absolute;
  inset: 0;                   /* top:0; right:0; bottom:0; left:0; */
  z-index: 1;
}

/* Que le carrousel prenne bien toute la place */
.hero-carousel-bg .elementor-widget-container {
  height: 100%;
}

.hero-carousel-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;          /* recadre comme un background */
}

/* CONTENU PAR-DESSUS (TEXTE + CTA) */
.hero-carousel-content {
  position: relative;
  z-index: 2;                 /* au-dessus du carrousel */
  width: 100%;
  max-width: 1100px;          /* largeur max du texte */
  margin: 0 auto;
  padding: 2rem 1.5rem;
  text-align: center;
  color: #ffffff;
}

/* Optionnel : voile sombre par-dessus le carrousel */
.hero-carousel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5); /* voile sombre 50% */
  z-index: 1.5;                   /* entre le carrousel (1) et le contenu (2) */
  pointer-events: none;
}

.hero-carousel {
  min-height: calc(100vh - 350px);
}

/* ========================= */
/* POST GRID A LA UNE           */
/* ========================= */

/* adapter les couleurs du texte + liens */
.anwp-pg-wrap a{
  color: #A31621;
  padding-left: 5px;
}
.anwp-pg-wrap a:hover{
  color: #B08D57;
}

.anwp-pg-wrap .anwp-pg-classic-grid .anwp-pg-post-teaser__content{
  border-bottom: none;
}


/* ========================= */
/* ARCHIVE_BUTTON CSS           */
/* ========================= */
.anwp-pg-wrap .anwp-btn-outline-secondary:focus, .anwp-pg-wrap .anwp-btn-outline-secondary {
  background-color: #A31621;
  color :#E3DCC2;
}
.anwp-pg-wrap .anwp-btn-outline-secondary:focus, .anwp-pg-wrap .anwp-btn-outline-secondary:hover {
  background-color: #B08D57;
  color :#E3DCC2;
}

/* ======================================== */
/*         PAGE article et artistes         */
/* ======================================= */
/* grid dernières publications */
.wpr-grid-slider-arrow{
  margin-top: 286px !important;
}


/* ========================= */
/*     PAGE CONTACT          */
/* ========================= */

/* adapter les couleurs */
.elementor-kit-11 input:not([type="button"]):not([type="submit"]), .elementor-kit-11 textarea, .elementor-kit-11 .elementor-field-textual{
  background-color: #E3DCC2;
  color:#000000;
}
.elementor-kit-11 input:focus:not([type="button"]):not([type="submit"]), .elementor-kit-11 textarea:focus, .elementor-kit-11 .elementor-field-textual:focus {
  color:#B08D57;
}
.wpcf7-list-item{
  color: #E3DCC2;
}
.wpcf7-response-output{
  color: #E3DCC2;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output{
  border-color: #a31922;
}


/* ========================= */
/*     BOX AUTHOR ARTICLE    */
/* ========================= */
.abh_job{
  color: #B08D57 !important;
}
.abh_text{
  color: #E3DCC2 !important;
}
.abh_facebook:hover{
  color: #B08D57 !important;
}
.abh_tab_content .abh_social{
  color: #B08D57 !important;
}
.abh_tab_content .abh_social a.abh_facebook::before{
font-size: 25px !important;
}


/* ====================================  */
/*     PAGE PHOTO : LIGHTBOX PHOTOS      */
/* ===================================  */

.spider_popup_close_fullscreen:hover{
  color : #a31922 !important;
}
.spider_popup_close_fullscreen{
  color : #B08D57 !important;
}


/* ====================================  */
/*     MAILPOET pages abonnements et autres     */
/* ===================================  */
.mailpoet-manage-subscription .mailpoet-change-email-info{
  color:#E3DCC2 !important;
}

.mailpoet_paragraph fieldset, .mailpoet_paragraph legend{
  color:#E3DCC2 !important;
}

.mailpoet_confirm_unsubscribe{
  color: #E3DCC2 !important;
}

/* ========================= */
/* FORMULAIRE PARTENARIAT    */
/* ========================= */
.wpcf7 textarea
{
    height:  100PX;
}
.wpcf7 label, .wpcf7-quiz-label{
  line-height: 2;
}

.wpcf7 form .wpcf7-response-output{
  display: none;
}


/* ========================= */
/*    GOOGLE TRANSLATOR      */
/* ========================= */
#glt-translate-trigger{
  box-shadow: 5px -5px 7px 0px #000000;
  border-radius: 5px;
  margin-left: 300px;
}
@media (max-width: 767px) {
  #glt-translate-trigger {
    margin-left: 0 !important;   /* stop le débordement */
    margin-right: 0.5rem;        /* petit espace respirable */
    transform: scale(0.85);      /* réduction visuelle */
    transform-origin: right center;
  }
}


/* ========================= */
/*    PAGE DES COOKIES      */
/* ========================= */

.cmplz-document, .editor-styles-wrapper .cmplz-unlinked-mode{
  color:#E3DCC2 !important;
}



/* ========================= */
/* FOOTER COULEURS           */
/* ========================= */

/* adapter les couleurs du texte + liens */
.MonFooter {
  color:#E3DCC2
}

.MonFooter a {
  color:#E3DCC2
}
.MonFooter a:hover {
  color:#B08D57
}