/* forms_black_or.css — n'affecte QUE les blocs .gnd-form */

/* Conteneur du formulaire noir/or */
.gnd-form .card,
.gnd-form form,
.gnd-form .modal-content {
  background-color: #0B0B0C !important;
  border: 1px solid #24262B !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.35) !important;
}

/* Titres et labels or */
.gnd-form h1, .gnd-form h2, .gnd-form h3, .gnd-form h4, .gnd-form h5, .gnd-form h6,
.gnd-form .form-label, .gnd-form label {
  color: #F0A026 !important;
  font-weight: 700 !important;
}

/* Champs noirs, texte blanc gras */
.gnd-form input[type="text"], .gnd-form input[type="password"], .gnd-form input[type="email"],
.gnd-form input[type="number"], .gnd-form input[type="tel"], .gnd-form input[type="search"],
.gnd-form textarea, .gnd-form select, .gnd-form .form-control, .gnd-form .form-select {
  background-color: #111317 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  border: 1px solid #24262B !important;
  border-radius: 14px !important;
}

.gnd-form input:focus, .gnd-form textarea:focus, .gnd-form select:focus,
.gnd-form .form-control:focus, .gnd-form .form-select:focus {
  border-color: #F0A026 !important;
  box-shadow: 0 0 0 .2rem rgba(240,160,38,.15) !important;
  outline: none !important;
}

/* Placeholders gris doux */
.gnd-form ::placeholder {
  color: #9AA3B2 !important;
  font-weight: 400 !important;
}

/* Boutons or */
.gnd-form .btn, .gnd-form .btn-primary, .gnd-form .btn-success, .gnd-form .btn-dark {
  background: linear-gradient(180deg, #F0A026, #D67F12) !important;
  color: #111111 !important;
  border: none !important;
  font-weight: 800 !important;
  border-radius: 999px !important;
}
.gnd-form .btn:hover {
  filter: brightness(1.05) !important;
  box-shadow: 0 12px 40px rgba(255,183,87,.45) !important;
  transform: translateY(-1px) !important;
}

/* Boutons outline dans formulaire */
.gnd-form .btn-outline-primary, .gnd-form .btn-outline-dark, .gnd-form .btn-outline-secondary {
  color: #F0A026 !important;
  border-color: #F0A026 !important;
  background: transparent !important;
}
.gnd-form .btn-outline-primary:hover, .gnd-form .btn-outline-dark:hover, .gnd-form .btn-outline-secondary:hover {
  background: #F0A026 !important;
  color: #111111 !important;
  border-color: #D67F12 !important;
}

/* Texte d’aide et cases à cocher */
.gnd-form .form-text { color: #A8AFBD !important; }
.gnd-form .form-check-input:checked { background-color: #F0A026 !important; border-color: #D67F12 !important; }

/* Alertes lisibles sur fond sombre */
.gnd-form .alert-info {
  background: rgba(0,207,232,.08) !important;
  color: #8feaff !important;
  border-color: #1f3a44 !important;
}

/* === Accentuation du titre principal dans les formulaires === */
.gnd-form h1, 
.gnd-form h2, 
.gnd-form h3 {
  color: #F0A026 !important;      /* orange or */
  font-weight: 800 !important;    /* plus épais */
  text-align: center;             /* bien centré */
  text-transform: uppercase;      /* facultatif : majuscules */
  letter-spacing: 0.5px;          /* petite respiration */
  text-shadow: 0 0 8px rgba(240,160,38,0.3); /* lueur douce dorée */
  margin-bottom: 1.5rem;          /* espace sous le titre */
}

/* Correction : forcer les titres gnd-title en orange dans les formulaires */
.gnd-form .gnd-title {
  color: #F0A026 !important;
  font-weight: 800 !important;
  text-align: center;
  text-shadow: 0 0 8px rgba(240,160,38,0.3);
}

/* Centrage + largeur raisonnable des formulaires .gnd-form */
.gnd-form{
  width: 100%;
  max-width: 720px;     /* ajuste si tu veux plus étroit: 640px ou 680px */
  margin-left: auto;
  margin-right: auto;   /* centre le bloc */
}

/* Option: un peu d’air vertical */
.gnd-form .card{ margin: 0; }

/* Alignement visuel des champs et du bouton */
.gnd-form .form-control,
.gnd-form .form-select,
.gnd-form .btn{
  min-height: 48px;
  border-radius: 14px;
}

/* Estimation "Montant estimé" en orange or */
.gnd-form #estimatedPrice{
  background: rgba(240,160,38,.10) !important; /* léger fond ambré */
  color: #F0A026 !important;                   /* texte orange or */
  border-color: #6b4b1d !important;
  font-weight: 700;
}
.gnd-form #estimatedPrice strong{
  color: #F8C24E !important; /* valeur un peu plus lumineuse */
  font-weight: 800;
}

/* largeur confortable pour les pages d'auth */
.gnd-auth { max-width: 720px; margin-left:auto; margin-right:auto; }

/* bouton un peu plus grand pour l'UX */
.gnd-auth .btn { min-height: 52px; font-size: 1.05rem; }

/* espace sous le bloc pour éviter que le footer "mange" le form */
.gnd-form { margin-bottom: 2.5rem; }

/* largeur confortable et marge bas pour éviter le footer collé */
.gnd-auth { max-width: 720px; margin: 0 auto 2.5rem; }

/* l'icône œil doit rester neutre (pas un bouton orange) */
.gnd-form #togglePwd{
  background: transparent !important;
  color: #A8AFBD !important;
  box-shadow: none !important;
  border: 0 !important;
  line-height: 1;
}

/* liens + texte d'aide lisibles sur fond noir */
.gnd-form a{ color:#F0A026 !important; }
.gnd-form a:hover{ color:#F8C24E !important; }
.gnd-form .text-muted{ color:#9AA3B2 !important; }

/* champ mot de passe : espace pour l'icône */
.gnd-form #password{ padding-right: 2.6rem; }

/* plus d'air à l'intérieur du formulaire sombre */
.gnd-form form.card{
  padding: 1.75rem 2rem !important;  /* L/R = 32px */
}
@media (min-width: 992px){
  .gnd-form form.card{ padding: 2rem 2.25rem !important; } /* un peu + large sur desktop */
}

/* garder un bouton large mais PAS pleine largeur sur grand écran */
.gnd-form .btn-primary{
  width: 100%;
  max-width: 420px;                  /* cap de largeur */
  margin-left: auto; margin-right: auto; /* centré */
}

/* liens et aides bien lisibles */
.gnd-form a{ color:#F0A026 !important; }
.gnd-form a:hover{ color:#F8C24E !important; }

/* === BOUTONS GAINDE === */
.btn-gold {
  background: linear-gradient(90deg, #F0A026, #D67F12);
  color: #fff;
  font-weight: 600;
  border: none;
  box-shadow: 0 0 8px rgba(240, 160, 38, 0.5);
  transition: all 0.3s ease-in-out;
}

.btn-gold:hover {
  background: linear-gradient(90deg, #D67F12, #F0A026);
  box-shadow: 0 0 15px rgba(240, 160, 38, 0.8);
  transform: scale(1.03);
  color: #fff;
}

.btn-green {
  background: linear-gradient(90deg, #006B3F, #008A4F);
  color: #fff;
  font-weight: 600;
  border: none;
  box-shadow: 0 0 8px rgba(0, 107, 63, 0.4);
  transition: all 0.3s ease-in-out;
}

.btn-green:hover {
  background: linear-gradient(90deg, #008A4F, #006B3F);
  box-shadow: 0 0 15px rgba(0, 107, 63, 0.7);
  transform: scale(1.03);
  color: #fff;
}

/* === Animation fade === */
.btn-fade {
  transition: opacity 0.8s ease;
}

.btn-hidden {
  opacity: 0 !important;
}

/* Zone d’affichage, centrée et stable (évite le chevauchement avec les alertes) */
.portal-switch{
  position: relative;
  height: 64px;              /* réserve l’espace pour les boutons */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 8px 0 12px 0;
  z-index: 1;                 /* sous les toasts/alertes mais au-dessus du fond */
}

/* Boutons superposés et centrés */
.portal-switch .portal-btn{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

/* Styles des boutons (thème GAINDE) */
.btn-gold{
  background: linear-gradient(90deg, #F0A026, #D67F12);
  color: #fff; font-weight: 600; border: none;
  box-shadow: 0 0 8px rgba(240,160,38,.5);
  transition: all .3s ease-in-out;
}
.btn-gold:hover{ background: linear-gradient(90deg,#D67F12,#F0A026); box-shadow:0 0 15px rgba(240,160,38,.8); transform: scale(1.03); color:#fff;}

.btn-green{
  background: linear-gradient(90deg, #006B3F, #008A4F);
  color:#fff; font-weight:600; border:none;
  box-shadow: 0 0 8px rgba(0,107,63,.4);
  transition: all .3s ease-in-out;
}
.btn-green:hover{ background: linear-gradient(90deg,#008A4F,#006B3F); box-shadow:0 0 15px rgba(0,107,63,.7); transform: scale(1.03); color:#fff;}

/* Fade fluide + masquage propre */
.btn-fade{ transition: opacity .8s ease; }
.btn-hidden{
  opacity: 0 !important;
  visibility: hidden;         /* évite le cliquable fantôme */
  pointer-events: none;
}