/*--------------------------------------------------------------
light-mode.css
Mode clair global – fond blanc et texte foncé
--------------------------------------------------------------*/
.text-white {color:white!important;}
.item-title {color:white!important;}

/* 01. Base globale */
body {
    background-color: #ffffff !important;
    color: #111111 !important;
    font-family: inherit;
    transition: background-color 0.3s ease, color 0.3s ease;
  }
  
  /* 02. Sections principales */
  header,
  footer,
  main,
  section,
  div {
   /* background-color: #ffffff !important;*/
   /* color: #111111 !important;*/
    color: #bf981b !important;
  }
  
  /* 03. Liens et boutons */
  a {
    /*color: #0066cc !important;*/
    color: #bf981b !important;
    text-decoration: none;
  }
  a:hover {
   /* color: #004a99 !important;*/
    color: #bf981b !important; 
  }
  
  button,
  input[type="submit"],
  .btn {
    background-color: #bf981b !important;
    color: #111111 !important;
    border: 1px solid #FFFFFF !important;
    transition: background-color 0.3s ease, color 0.3s ease;
  }
  button:hover,
  input[type="submit"]:hover,
  .btn:hover {
    background-color: #e6e6e6 !important;
  }
  


  /* 04. Blocs spéciaux (showcase, hero, portfolio) */
  .showcase,
  .hero,
  .portfolio {
    background-image: none !important;
/*    background-color: #ffffff !important; */
    color: #111111 !important;
  }
  
  .hero-subtitle{color:grey}

  /* 05. Cartes, boîtes, encarts */
  .card,
  .box,
  .widget {
    background-color: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
    color: #111111 !important;
  }
  
  /* 06. Textes et titres */
  h1, h2, h3, h4, h5, h6 {
    color: #000000 !important;
  }
  /*p, span, li {*/
    p,  li {
        color: #222222 !important;
  }
  
  /* 07. Images et médias */
  img, video {
    filter: none !important;
    opacity: 1 !important;
  }
  
  /* 08. Effets spéciaux (préloader, curseur magique) */
  .preloader,
  .magic-cursor {
    background: #ffffff !important;
    border-color: #cccccc !important;
  }
  
  /* 09. Bordures et séparateurs */
  hr {
    border-color: #dddddd !important;
  }
  
  /* 10. Pied de page */
  footer {
    background-color: #fafafa !important;
    color: #111111 !important;
  }

  .hero-subtitle {color:#b2a269;}


  input, textarea {
    color: black !important;
    border-bottom: 1px solid gray !important;
}
::placeholder {
    color: #888888 !important; /* gris clair lisible sur fond blanc */
    opacity: 1; /* nécessaire sur certains navigateurs */
  }
  
  /* Compatibilité navigateurs */
  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #888888 !important;
  }
  
  ::-ms-input-placeholder { /* Microsoft Edge Legacy */
    color: #888888 !important;
  }
  
  /* Si tu veux un effet au focus */
  input:focus::placeholder,
  textarea:focus::placeholder {
    color: #bbbbbb !important; /* s’éclaircit quand l’utilisateur clique */
  }



  /* Couleur du texte indicatif (placeholder) */
input::placeholder,
textarea::placeholder {
  color: #999999;
  transition: color 0.3s ease;
}

/* Quand on clique (focus) : ligne dorée + légère animation */
input:focus,
textarea:focus {
  outline: none;
  border-bottom-color: #d4af37; /* doré */
  box-shadow: 0 1px 0 0 #d4af37;
}

/* Optionnel : éclaircir le placeholder au focus */
input:focus::placeholder,
textarea:focus::placeholder {
  color: #c1a45c;
}

/* Pour un effet plus fluide (underline qui s’étend) */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
  position: relative;
}

input[type="text"]::after,
input[type="email"]::after,
input[type="tel"]::after,
textarea::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 2px;
  background-color: #d4af37;
  transition: width 0.3s ease;
}

/* Animation du soulignement doré */
input[type="text"]:focus::after,
input[type="email"]:focus::after,
input[type="tel"]:focus::after,
textarea:focus::after {
  width: 100%;
}


#main-page-content h1,#main-page-content h2,#main-page-content h3,#main-page-content h4,#main-page-content h5{color:#bf981b!important;} 