/* =====================================================================
   Admin de l'espace client. Complete app.css, ne le remplace pas.
   Pense pour le telephone d'abord : c'est la ou Freddy depose ses fichiers.
   ===================================================================== */

.bloc{
  background:linear-gradient(180deg, var(--bg-carte-haut), var(--bg-carte));
  border:1px solid var(--cream-faint);
  border-radius:18px;
  padding:clamp(18px, 4vw, 30px);
  margin-bottom:1.2rem;
}
.bloc__entete{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  margin-bottom:1rem;
}

.grille{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
  gap:1rem;
  margin:1.2rem 0;
}
.champ--large{grid-column:1 / -1}
.actions{grid-column:1 / -1; display:flex; gap:.6rem; flex-wrap:wrap}

.champ__select,
.champ textarea{
  font:inherit;
  color:var(--cream);
  background:rgba(0,0,0,.35);
  border:1px solid var(--cream-faint);
  border-radius:10px;
  padding:.8rem .95rem;
  min-height:48px;
  width:100%;
}
.champ__select:focus,
.champ textarea:focus{outline:none; border-color:var(--gold)}
.champ textarea{resize:vertical; line-height:1.5}

/* -------------------------------- Depot ----------------------------- */

.depot{
  border:1.5px dashed var(--cream-faint);
  border-radius:16px;
  padding:clamp(24px, 7vw, 46px) 1.2rem;
  text-align:center;
  cursor:pointer;
  transition:border-color .2s ease, background .2s ease;
}
.depot:hover,
.depot.est-survole{border-color:var(--gold); background:rgba(200,130,10,.06)}
.depot__texte{margin:0; color:var(--cream); font-size:.98rem}
.depot__texte span{color:var(--cream-dim); font-size:.85rem}

.choisis{list-style:none; margin:1rem 0 0; padding:0; display:grid; gap:.4rem}
.choisis li{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  font-size:.85rem;
  color:var(--cream-dim);
  border-bottom:1px solid var(--cream-faint);
  padding-bottom:.4rem;
}
.choisis li strong{color:var(--cream); font-weight:500; overflow-wrap:anywhere}
.choisis li.est-fait{color:var(--vert)}
.choisis li.est-rate{color:var(--red)}

.journal{
  margin:1rem 0 0;
  font-size:.86rem;
  color:var(--cream-dim);
  min-height:1.3rem;
  white-space:pre-line;
}
.journal.est-ok{color:var(--gold-clair)}
.journal.est-erreur{color:var(--red)}

/* -------------------------------- Acces ----------------------------- */

.acces{list-style:none; margin:0 0 1rem; padding:0; display:grid; gap:.5rem}
.acces li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  background:rgba(0,0,0,.25);
  border:1px solid var(--cream-faint);
  border-radius:10px;
  padding:.6rem .9rem;
  font-size:.88rem;
  overflow-wrap:anywhere;
}

.ligne-form{display:flex; gap:.6rem; flex-wrap:wrap}
.ligne-form input{
  flex:1 1 220px;
  font:inherit;
  color:var(--cream);
  background:rgba(0,0,0,.35);
  border:1px solid var(--cream-faint);
  border-radius:999px;
  padding:.6rem 1rem;
  min-height:44px;
}
.ligne-form input:focus{outline:none; border-color:var(--gold)}

.note{color:var(--cream-dim); font-size:.8rem; margin:.8rem 0 0}

/* ------------------------- Boutons discrets ------------------------- */

.lien-action{
  font:inherit;
  font-size:.8rem;
  background:none;
  border:none;
  color:var(--cream-dim);
  cursor:pointer;
  padding:.3rem .2rem;
  text-decoration:underline;
  text-underline-offset:3px;
}
.lien-action:hover{color:var(--gold)}
.lien-action--danger:hover{color:var(--red)}

/* --------------------------- Corrections mobile ---------------------
   Constate au telephone (375 px) : l'entete debordait de 24 px et les
   actions de ligne faisaient moins de 40 px de haut, donc difficiles a
   viser au pouce.                                                      */

@media (max-width: 520px){
  .entete{flex-wrap:wrap; row-gap:.6rem}
  .entete__droite{width:100%; justify-content:flex-end}
  .entete__marque img{width:78px}
}

.lien-action{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  padding:.4rem .5rem;
}
