/* =========================================================
   Oursbelille – Thème UI (match maquettes)
   Palette: jaune #FFF5B1 | rouge #E4472E | noir #111 | gris doux
   ========================================================= */

/* ---------- Variables ---------- */
:root{
  --bg: #FFF5B1;            /* fond principal */
  --bg-hero: #FFE97A;       /* légère variation */
  --card: #FFFFFF;
  --ink: #111111;
  --ink-soft: #2b2b2b;
  --muted: #6a6a6a;
  --soft-border: rgba(0,0,0,.10);
  --soft-border-weak: rgba(0,0,0,.06);
  --shadow: 0 10px 24px rgba(0,0,0,.12);
  --shadow-sm: 0 6px 16px rgba(0,0,0,.10);
  --shadow-lg: 0 16px 36px rgba(0,0,0,.18);
  --accent: #FFC83D;        /* jaune action/boutons */
  --accent-ink: #000;
  --danger: #E4472E;        /* bandeau rouge */
  --success: #28a745;
  --focus-ring: 0 0 0 .18rem rgba(0,0,0,.15);
}

/* ---------- Base ---------- */
html,body{height:100%}
body.bg-jaune{
  background: var(--bg);
  min-height:100vh;
  color:var(--ink);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
a{ color: inherit; text-decoration: none; }
a:hover{ text-decoration: underline; }

/* ---------- Navbar ---------- */
.nav-public{
  position: sticky; top:0; z-index:1000;
  background:#111; color:#fff;
  padding:.65rem 0;
  box-shadow: 0 4px 18px rgba(0,0,0,.35);
}
.nav-public .navbar-brand{ color:#fff !important; font-weight:900; letter-spacing:.2px; display:flex; align-items:center; gap:.55rem; }
.nav-public .navbar-brand img{ width:64px; height:64px; border-radius:50%; background:#fff; }
.nav-public .nav-link{ color:#eaeaea !important; font-weight:800; }
.nav-public .nav-link.active{ color:#fff !important; }
.nav-public .navbar-text{ color:#fff !important; }

/* ---------- Bandeau rouge global ---------- */
.global-banner{
  background: var(--danger); color:#fff; font-weight:900;
  border-radius:12px; padding:.7rem 1rem; margin:.8rem 0 1.1rem;
  box-shadow: var(--shadow-sm);
}

/* ---------- Cartes & conteneurs ---------- */
.soft-card{
  background: var(--card);
  border:1px solid var(--soft-border-weak);
  border-radius:16px;
  box-shadow: var(--shadow);
}
.soft-card.slim{ box-shadow: var(--shadow-sm); }
.card-muted{
  background:#fffef6; border:1px solid var(--soft-border);
}

/* Sections encadrées façon “widget” */
.widget{
  background: var(--card);
  border:1px solid var(--soft-border-weak);
  border-radius:14px;
  box-shadow: var(--shadow-sm);
  padding: .85rem 1rem;
}

/* ---------- Titres ---------- */
h1,h2,h3,.hero-title{ letter-spacing:.1px; }
.hero-title{ font-weight:900; font-size:clamp(1.8rem, 3.8vw, 2rem); line-height:1.08; }

/* ---------- Boutons ---------- */
.btn{
  border-radius:14px; font-weight:800; letter-spacing:.1px;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}
.btn:focus{ box-shadow: var(--focus-ring); }
.btn-sm{ padding:.45rem .75rem; border-radius:12px; font-weight:900; }
.btn-main{
  background:#111; color:var(--accent);
  border:none;
}
.btn-main:hover{ background:var(--accent); color:#000; box-shadow: var(--shadow-lg); }
.btn-ghost{
  background:#fff; border:2px solid #111; color:#111;
}
.btn-ghost:hover{ background:#111; color:var(--accent); }
.btn-pill{
  background: var(--accent); color:#000; border:none;
  border-radius:999px; padding:.35rem .9rem; font-weight:900;
}

/* Boutons compacts sur les cartes tâches */
.btn-task{ padding:.28rem .6rem; border-radius:12px; font-size:.85rem; font-weight:900; }
.btn-task-ghost{ background:#fff; border:2px solid #111; }
.btn-task-ghost:hover{ background:#111; color:var(--accent); }
.btn-task-main{ background:#111; color:var(--accent); border:none; }
.btn-task-main:hover{ background:var(--accent); color:#000; }

/* ---------- Formulaires ---------- */
.form-control,.form-select{
  border:2px solid rgba(0,0,0,.18); border-radius:10px;
}
.form-control:focus,.form-select:focus{ border-color:#000; box-shadow: var(--focus-ring); }

/* ---------- Tableaux ---------- */
.table-clean{
  background:#fff; border-radius:14px; overflow:hidden;
}
.table-clean th{ color:#000; font-weight:900; }
.table-clean td,.table-clean th{
  border-color: rgba(0,0,0,.08) !important; padding:.9rem .85rem;
}
.table-clean tr:hover td{ background: rgba(0,0,0,.025); }

/* ---------- Étiquettes & badges ---------- */
.badge{
  border-radius:999px; font-weight:900; padding:.15rem .55rem;
}
.badge-soft{ background:#f5f5f5; color:#333; }
.badge-ok{ background:#e7f8ea; color:#146c2e; }
.badge-warn{ background:#ffe6cc; color:#7a3f00; }
.badge-danger{ background:#ffe0db; color:#7a0000; }

/* Mineurs / consentement */
.badge-minor{ background:#111; color:#FFC83D; }
.badge-consent-none{ background:#efefef; color:#333; }
.badge-consent-requested{ background:#FFE08A; color:#3a2a00; }
.badge-consent-uploaded{ background:#d6f0ff; color:#00324d; }
.badge-consent-validated{ background:#1f2937; color:#fff; }
.badge-consent-rejected{ background:#E4472E; color:#fff; }

/* ---------- Kanban ---------- */
.kanban-wrap{
  display:grid; grid-template-columns: repeat(3, minmax(260px,1fr));
  gap:1rem;
}
.kan-col{
  background:#fffef6; border:1px solid var(--soft-border);
  border-radius:14px; padding:.75rem; min-height:420px;
  box-shadow: var(--shadow-sm);
  overflow:auto; max-height: 64vh;
}
.kan-title{ font-weight:900; margin:.2rem .25rem .6rem; display:flex; align-items:center; gap:.5rem; }

/* Carte tâche */
.task-card{
  background:#fff; border:1px solid rgba(0,0,0,.08);
  border-radius:12px; padding:.65rem .7rem; margin:.55rem 0;
  box-shadow: var(--shadow-sm);
  cursor: grab;
}
.task-title{ font-weight:900; display:flex; align-items:center; gap:.45rem; }

/* Pastille priorité + badge texte */
.priority-dot{ width:12px; height:12px; border-radius:50%; flex:0 0 12px; box-shadow: inset 0 0 0 2px rgba(0,0,0,.2); }
.pill{ display:inline-flex; align-items:center; gap:.35rem; font-weight:900; border-radius:999px; padding:.15rem .6rem; font-size:.85rem; }
.p-P1{ background:#FCE0DC; color:#7c0000; }
.p-P2{ background:#FFE7C5; color:#7a3f00; }
.p-P3{ background:#FFF2AE; color:#5b4a00; }
.p-P4{ background:#DDF3DF; color:#0E5F1E; }

/* ---------- Fichiers ---------- */
.dropzone{
  border:2px dashed rgba(0,0,0,.25); border-radius:14px;
  padding:1.2rem; text-align:center; background:#fffef6; color:#333;
}
.dropzone.dragover{ background:#fff2b3; }
.file-row .icon{
  width:24px; height:24px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; color:#fff; margin-right:.5rem;
}
.icon-pdf{ background:#E4472E; } .icon-png{ background:#27AE60; }
.icon-xls{ background:#2ECC71; } .icon-doc{ background:#2980B9; } .icon-generic{ background:#7f8c8d; }

/* ---------- Discussion (chat) ---------- */
.chat-box{
  background:#fff; border:1px solid var(--soft-border); border-radius:14px; box-shadow: var(--shadow-sm);
  padding: .8rem; min-height: 240px; max-height: 60vh; overflow:auto;
}
.chat-item{ padding:.35rem .45rem; border-bottom:1px dashed rgba(0,0,0,.08); }
.chat-item:last-child{ border-bottom:0; }
.chat-meta{ color:var(--muted); font-size:.85rem; }

/* Champ message + bouton alignés */
.chat-input{ display:flex; gap:.5rem; align-items:center; }
.chat-input .form-control{ flex:1; }

/* ---------- Héro/En-têtes modules ---------- */
.hero-wrap{
  background: var(--bg-hero);
  border: 1px solid var(--soft-border);
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 1.2rem 1rem;
}

/* ---------- Utilitaires ---------- */
.text-soft{ color: var(--muted); }
.shadow-soft{ box-shadow: var(--shadow-sm); }
.rounded-14{ border-radius:14px; }
.rounded-16{ border-radius:16px; }
.border-soft{ border:1px solid var(--soft-border-weak); }

/* ---------- Responsive ---------- */
@media (max-width: 992px){
  .kanban-wrap{ grid-template-columns: 1fr; }
  .kan-col{ max-height: none; }
  .nav-public{ padding:.55rem 0; }
  .global-banner{ margin:.65rem 0 .9rem; }
}
@media (max-width: 576px){
  .btn{ box-shadow: 0 4px 12px rgba(0,0,0,.12); }
  .task-card{ padding:.6rem; }
  .btn-task{ font-size:.82rem; }
  .chat-input{ flex-direction: column; align-items: stretch; }
}

/* ---------- Petites améliorations d’accessibilité ---------- */
:focus-visible{ outline: 2px dashed rgba(0,0,0,.55); outline-offset: 2px; }
/* Priorité très visible */
.prio-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.15rem .55rem;border-radius:999px;font-weight:900;font-size:.78rem}
.prio-dot{display:inline-block;width:.55rem;height:.55rem;border-radius:999px;background:#000;opacity:.45}
.prio-P1{background:#FCE0DC;color:#7f0000;box-shadow:0 8px 18px rgba(231,76,47,.25)}
.prio-P2{background:#FFE3B3;color:#8A4700;box-shadow:0 8px 18px rgba(255,149,0,.22)}
.prio-P3{background:#FFF2AE;color:#6B5B00;box-shadow:0 8px 18px rgba(255,206,84,.20)}
.prio-P4{background:#DDF3DF;color:#0E5F1E;box-shadow:0 8px 18px rgba(52,199,89,.18)}

/* Colonnes limitées à 7 cartes avec scroll */
.kanban-col.limit7{max-height:calc(7 * 92px + 18px);overflow:auto;padding-right:.25rem}
.task-tile{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:.7rem;margin:.45rem 0;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.btn-task-xs{padding:.25rem .5rem;border-radius:10px;font-weight:800}
.assignees-chips{max-height:60px;overflow:auto}
.assignees-scroll{max-height:160px;overflow:auto;border:1px dashed rgba(0,0,0,.1);border-radius:8px;padding:.5rem;background:#fffef8}

/* Flou lors de la modal de création */
.modal-blur main, .modal-blur .container, .modal-blur .soft-card {filter: blur(2px); transition: filter .2s}