/* Hiérarchie du panneau « Choisir la bonne trace ».
   Les styles s'activent uniquement lorsque le panneau de suivi est affiché. */
.action-panel--suivi-preview .panel-links{
  display:block;
  margin-top:14px;
}

.suivi-preview-groups{
  display:grid;
  gap:13px;
}

.suivi-preview-heading{
  display:flex;
  align-items:center;
  gap:7px;
  margin:0;
  color:#9fb8c2;
  font-size:8px;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.suivi-preview-heading::after{
  content:"";
  flex:1;
  height:1px;
  background:rgba(216,170,67,.22);
}

.suivi-preview-feature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:7px;
}

.panel-links .suivi-preview-feature{
  position:relative;
  display:grid;
  grid-template-columns:33px minmax(0,1fr);
  gap:9px;
  align-items:start;
  min-height:84px;
  padding:11px 24px 10px 10px;
  border:1px solid rgba(113,203,178,.42);
  border-radius:11px;
  background:linear-gradient(145deg,rgba(53,120,112,.3),rgba(19,61,70,.38));
  color:#fff;
  box-shadow:inset 0 1px rgba(255,255,255,.06);
}

.panel-links .suivi-preview-feature--create{
  border-color:rgba(216,170,67,.58);
  background:linear-gradient(145deg,rgba(216,170,67,.18),rgba(23,57,66,.46));
}

.panel-links .suivi-preview-feature:hover,
.panel-links .suivi-preview-feature:focus-visible{
  border-color:#86ddc3;
  background:linear-gradient(145deg,rgba(58,136,124,.4),rgba(25,70,79,.52));
  transform:translateY(-1px);
}

.panel-links .suivi-preview-feature--create:hover,
.panel-links .suivi-preview-feature--create:focus-visible{
  border-color:#f1cc72;
  background:linear-gradient(145deg,rgba(216,170,67,.26),rgba(31,72,77,.54));
}

.suivi-preview-icon{
  display:grid;
  place-items:center;
  width:33px;
  height:33px;
  border-radius:9px;
  background:#dff3ec;
  color:#0b6d52;
  font:700 17px/1 Georgia,serif;
}

.suivi-preview-feature--create .suivi-preview-icon{
  background:#f5dfaa;
  color:#163747;
}

.suivi-preview-feature b,
.suivi-preview-feature small{
  display:block;
}

.suivi-preview-feature b{
  color:#fff;
  font-size:11px;
  line-height:1.25;
}

.suivi-preview-feature small{
  margin-top:4px;
  color:#b8cbd2;
  font-size:8.5px;
  line-height:1.35;
}

.suivi-preview-feature .suivi-preview-arrow{
  position:absolute;
  right:9px;
  bottom:8px;
  color:var(--gold-soft);
  font-size:14px;
}

.suivi-preview-mini-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:7px;
}

.panel-links .suivi-preview-mini{
  display:flex;
  min-width:0;
  min-height:76px;
  padding:9px 8px;
  border:1px solid rgba(214,230,236,.22);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  color:#fff;
  text-decoration:none;
  flex-direction:column;
}

.panel-links .suivi-preview-mini:hover,
.panel-links .suivi-preview-mini:focus-visible{
  border-color:#71cbb2;
  background:rgba(255,255,255,.075);
  transform:translateY(-1px);
}

.suivi-preview-mini-icon{
  display:grid;
  place-items:center;
  width:27px;
  height:25px;
  margin-bottom:7px;
  border-radius:7px;
  background:#102e3d;
  color:var(--gold-soft);
  font-size:7.5px;
  font-weight:800;
  letter-spacing:.04em;
}

.suivi-preview-mini b{
  color:#eef6f7;
  font-size:9px;
  line-height:1.2;
}

.suivi-preview-mini small{
  display:block;
  margin-top:3px;
  color:#8faab5;
  font-size:7.5px;
  line-height:1.25;
}

.action-panel--suivi-preview .panel-note{
  margin-top:14px;
  padding-top:13px;
}

.action-panel--suivi-preview .panel-note strong{
  display:flex;
  align-items:center;
  gap:6px;
}

.action-panel--suivi-preview .panel-note strong::before{
  content:"✓";
  display:grid;
  place-items:center;
  width:17px;
  height:17px;
  border-radius:50%;
  background:rgba(113,203,178,.16);
  color:#8dd9c3;
  font-size:9px;
}

@media(max-width:700px){
  .suivi-preview-feature-grid,
  .suivi-preview-mini-grid{grid-template-columns:1fr}
  .panel-links .suivi-preview-feature,
  .panel-links .suivi-preview-mini{min-height:64px}
  .panel-links .suivi-preview-mini{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;column-gap:10px}
  .suivi-preview-mini-icon{grid-row:1/3;margin:0}
}