/* =========================================================
   AVENOR — ATELIER (GLOBAL) — CSS PROPRE & SANS DOUBLONS
   Objectif : style inchangé, mais nettoyage complet.
   ========================================================= */

/* =========================
   ATELIER — ONGLET NAV
   ========================= */

.atelier-tabs{
  display:flex;
  gap:12px;
  margin: 12px 0 32px;
  flex-wrap:wrap;
}

.atelier-tab{
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid rgba(212,175,55,.35);
  background: rgba(255,255,255,.04);
  color:#fff;
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  transition: all .2s ease;
}

.atelier-tab:hover{
  border-color: rgba(212,175,55,.55);
  background: rgba(212,175,55,.10);
}

.atelier-tab.is-active{
  background: linear-gradient(180deg, rgba(212,175,55,.22), rgba(212,175,55,.10));
  border-color: rgba(212,175,55,.90);
  color: rgba(255,215,100,0.98);
  box-shadow:
    0 0 0 1px rgba(212,175,55,.35),
    0 8px 24px rgba(212,175,55,.18);
}

/* ===============================
   AVENOR — CARD (SCÉNARIOS/UI)
   =============================== */

.avenor-card{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  box-shadow: 0 10px 30px rgba(0,0,0,0.20);
  max-width: 1100px; /* si tu veux full width, enlève cette ligne */
  overflow: hidden;
}

.avenor-card__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding: 18px 18px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.avenor-card__title{
  margin:0;
  font-size:16px;
  letter-spacing:.02em;
  color:#fff;
}

.avenor-card__subtitle{
  margin:6px 0 0;
  color: rgba(255,255,255,0.72);
  font-size: 13px;
}

.avenor-card__body{
  padding: 14px 18px 18px;
}

/* ===============================
   AVENOR — BUTTONS
   =============================== */

.btn-avenor{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  color: #fff;
  cursor:pointer;
  text-decoration:none;
  font-weight: 600;
  letter-spacing: .02em;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

.btn-avenor:hover{
  transform: translateY(-1px);
  border-color: rgba(212,175,55,0.55);
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}

.btn-avenor--gold{
  border-color: rgba(212,175,55,0.55);
  background: rgba(212,175,55,0.10);
  color: rgba(255,215,100,0.98);
}

/* ===============================
   AVENOR — CHIPS
   =============================== */

.chip{
  display:inline-flex;
  align-items:center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.85);
  line-height: 1;
}

.chip--gold{
  border-color: rgba(212,175,55,0.55);
  background: rgba(212,175,55,0.10);
  color: rgba(255,215,100,0.98);
}

.chip--soft{
  opacity: .9;
}

/* ===============================
   SCÉNARIOS — LISTE
   Structure finale : ligne cliquable + poubelle isolée
   =============================== */

.avenor-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* Ligne globale (wrapper) */
.avenor-row{
  display:flex;
  align-items:center;
  gap:14px;
}

/* Zone cliquable : prend toute la largeur dispo (s’arrête avant la poubelle) */
.avenor-row__link{
  flex: 1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.18);

  text-decoration:none;
  color:#fff;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}

.avenor-row__link:hover{
  transform: translateY(-1px);
  border-color: rgba(212,175,55,0.35);
  background: rgba(255,255,255,0.04);
}

/* Texte gauche */
.avenor-row__title{
  font-weight:700;
  letter-spacing:.02em;
}

/* Meta sous le titre */
.avenor-row__meta{
  margin-top:6px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* ===============================
   POUBELLE — ACTION ISOLÉE
   =============================== */

.row-trash-form{
  flex-shrink: 0;
  display:flex;
  align-items:center;
}

/* Bouton poubelle */
.btn-trash{
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.75);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease, color .12s ease, box-shadow .12s ease;
}

.btn-trash__icon{
  width: 18px;
  height: 18px;
}

.btn-trash:hover{
  transform: translateY(-1px);
  border-color: rgba(239,68,68,.55);
  background: rgba(239,68,68,.12);
  color: #fecaca;
  box-shadow: 0 10px 30px rgba(0,0,0,0.22);
}

/* ===============================
   EMPTY STATE
   =============================== */

.avenor-empty{
  padding: 18px;
  border-radius: 14px;
  border: 1px dashed rgba(255,255,255,0.18);
  background: rgba(0,0,0,0.16);
}

.avenor-empty__title{
  font-weight: 800;
  margin-bottom: 6px;
  color:#fff;
}

.avenor-empty__text{
  color: rgba(255,255,255,0.75);
  font-size: 13px;
}

/* ===============================
   RESPONSIVE
   =============================== */

@media (max-width: 720px){
  .avenor-row{
    gap:10px;
  }
  .avenor-row__link{
    padding: 14px 14px;
    border-radius: 16px;
  }
}