/* team.owan.fr — board "Amélioration d'Owan" — extension de owan.css */

:root{
  --new:var(--accent);    /* Nouveautés  (accent OWAN #542DF3) */
  --imp-soft:#FFC05F;      /* warning OWAN — bordures/icônes Améliorations */
  --imp:#E8902B;           /* orange accent Améliorations */
  --bug:var(--danger);    /* Bugs (danger OWAN #F86251) — bordures/icônes */
  /* fonds des états COCHÉS : assombris pour texte blanc lisible (WCAG AA) */
  --new-on:var(--accent);
  --imp-on:#B4690E;
  --bug-on:#D63E2C;
}

/* large layout pour 3 colonnes */
.wrap-wide{ max-width:1120px; }

.hero-sub{
  text-align:center; max-width:520px; margin:6px auto 6px;
  color:var(--muted); font-size:15px; line-height:1.5;
}

/* ── Carte formulaire ─────────────────────────────────────────── */
.form-card{ max-width:760px; margin:18px auto 8px; padding:24px 22px; }
.form-grid{ display:grid; grid-template-columns:1fr 1.3fr; gap:18px; margin-bottom:16px; }
@media (max-width:680px){ .form-grid{ grid-template-columns:1fr; gap:14px; } }

.lbl{
  display:block; font-size:12px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color:var(--muted-2); margin:0 0 8px 2px;
}

/* select "Qui êtes-vous ?" */
.select-wrap{ position:relative; }
.select-wrap select{
  appearance:none; -webkit-appearance:none;
  width:100%; font-family:var(--font); font-size:15px; font-weight:500;
  color:var(--ink); background:#fff;
  border:1.5px solid var(--line); border-radius:var(--radius);
  padding:12px 40px 12px 14px; cursor:pointer; outline:none;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.select-wrap select:focus{ border-color:transparent; box-shadow:0 0 0 2px var(--focus-ring); }
.select-wrap .chev{
  position:absolute; right:13px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; color:var(--muted-2); pointer-events:none;
}

/* segmented control "Type de retour" */
.seg{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
@media (max-width:420px){ .seg{ grid-template-columns:1fr; } }
.seg-opt{ position:relative; cursor:pointer; }
.seg-opt input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.seg-opt span{
  display:flex; align-items:center; justify-content:center; gap:6px;
  height:100%; min-height:46px; padding:8px 6px;
  font-size:13.5px; font-weight:600; color:var(--muted);
  background:#fff; border:1.5px solid var(--line); border-radius:12px;
  text-align:center; line-height:1.2;
  transition:border-color .15s, background .15s, color .15s, box-shadow .15s;
}
.seg-opt:hover span{ border-color:rgba(14,19,34,.16); }
.seg-opt input:focus-visible + span{ outline:2px solid var(--focus); outline-offset:2px; }
.seg-new input:checked + span{ color:#fff; background:var(--new-on); border-color:var(--new-on); box-shadow:0 8px 18px -8px rgba(84,45,243,.55); }
.seg-imp input:checked + span{ color:#fff; background:var(--imp-on); border-color:var(--imp-on); box-shadow:0 8px 18px -8px rgba(180,105,14,.5); }
.seg-bug input:checked + span{ color:#fff; background:var(--bug-on); border-color:var(--bug-on); box-shadow:0 8px 18px -8px rgba(214,62,44,.5); }

/* textarea message */
.field-area textarea{
  width:100%; font-family:var(--font); font-size:15px; color:var(--ink);
  background:#fff; border:1.5px solid var(--line); border-radius:var(--radius);
  padding:13px 15px; outline:none; resize:vertical; min-height:108px; line-height:1.5;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.field-area textarea::placeholder{ color:var(--muted-2); }
.field-area textarea:focus{ border-color:transparent; box-shadow:0 0 0 2px var(--focus-ring); }
.form-card .cta{ margin-top:18px; }
.form-card .erreur-box{ margin-bottom:16px; }

/* ── Board 3 colonnes ─────────────────────────────────────────── */
.board{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
  margin-top:30px; align-items:start;
}
@media (max-width:920px){ .board{ grid-template-columns:1fr; max-width:640px; margin-inline:auto; } }

.col{
  background:var(--card); border-radius:22px; padding:14px 14px 16px;
  box-shadow:0 24px 50px -34px rgba(14,19,34,.18), inset 0 1px 0 rgba(255,255,255,.9);
  border-top:3px solid var(--line);
}
.col.cat-new{ border-top-color:var(--new); }
.col.cat-imp{ border-top-color:var(--imp-soft); }
.col.cat-bug{ border-top-color:var(--bug); }

.col-head{ display:flex; align-items:center; gap:11px; padding:6px 4px 14px; }
.col-icon{
  width:38px; height:38px; flex:none; display:flex; align-items:center; justify-content:center;
  font-size:19px; border-radius:12px; background:rgba(14,19,34,.04);
}
.cat-new .col-icon{ background:rgba(84,45,243,.10); }
.cat-imp .col-icon{ background:rgba(255,192,95,.20); }
.cat-bug .col-icon{ background:rgba(248,98,81,.12); }
.col-title{ flex:1; min-width:0; }
.col-title h2{ font-size:16px; font-weight:700; color:var(--ink); letter-spacing:-.01em; }
.col-sub{ font-size:12px; color:var(--muted-2); }
.col-count{
  flex:none; min-width:26px; height:24px; padding:0 8px;
  display:flex; align-items:center; justify-content:center;
  font-size:12.5px; font-weight:700; color:var(--muted);
  background:rgba(14,19,34,.05); border-radius:99px;
}

.col-list{ display:flex; flex-direction:column; gap:9px; }
.empty{
  text-align:center; color:var(--muted-2); font-size:13px;
  padding:22px 8px; border:1.5px dashed var(--line); border-radius:14px;
}

/* ── Ticket ───────────────────────────────────────────────────── */
.ticket{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:12px 13px; box-shadow:0 12px 26px -22px rgba(14,19,34,.2);
  animation:rise .4s ease both;
}
.ticket-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:7px; }
.who{ display:flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--ink); min-width:0; }
.who-emoji{ font-size:14px; }
.who-co{ font-weight:500; color:var(--muted-2); }
.ticket-top time{ flex:none; font-size:11px; color:var(--muted-2); }
.ticket-body{ font-size:14px; line-height:1.5; color:var(--ink); word-break:break-word; }

@media (max-width:700px){ .wrap-wide{ padding-left:14px; padding-right:14px; } }