/* ===========================================================
   Modal "Quickwork — Éditeur rapide" — version PRO
   Préfixe: wqw-  (Wonder Quickwork)
   Scope: #modalQuickwork
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

#modalQuickwork{
  --ink:#0e1411; --line:#e8eae6; --line-2:#eef0ec; --muted:#6b7565; --soft:#f6f6f3; --paper:#ffffff;
  --green:#14543a; --green-d:#0d3d2a; --green-soft:#e7efe9; --accent:#1f2d27;
  --warn:#b45309; --warn-soft:#fef3c7; --danger:#9d2929; --danger-soft:#fde7e7;
  --blue:#1e3a8a; --blue-soft:#e0e7ff; --violet:#5b21b6; --violet-soft:#ede9fe;
  --teal:#0f766e; --teal-soft:#ccfbf1; --gold:#c98a16;
}

/* Override container : plein écran */
#modalQuickwork.modal-overlay{ padding:0 !important; }
#modalQuickwork .wqw-shell{
  width:100vw; height:100vh;
  background:var(--paper);
  display:flex; flex-direction:column; overflow:hidden;
  font-family:'Inter', system-ui, sans-serif; color:var(--ink); font-size:14px;
}
#modalQuickwork .wqw-shell *{ box-sizing:border-box; }

/* Header */
#modalQuickwork .wqw-hd{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; border-bottom:1px solid var(--line); flex-shrink:0;
  background:var(--paper);
}
#modalQuickwork .wqw-title{ display:flex; align-items:center; gap:13px; }
#modalQuickwork .wqw-title .wqw-ic{
  width:40px; height:40px; border-radius:11px; background:var(--ink);
  color:#86efac; display:grid; place-items:center;
}
#modalQuickwork .wqw-title h2{
  margin:0; font:700 19px 'Inter'; letter-spacing:-0.01em; color:var(--ink);
}
#modalQuickwork .wqw-title .wqw-sub{ font:500 12px 'Inter'; color:var(--muted); margin-top:1px; }
#modalQuickwork .wqw-x{
  width:38px; height:38px; border-radius:10px; border:1px solid var(--line);
  background:var(--paper); display:grid; place-items:center; color:var(--muted); cursor:pointer;
}
#modalQuickwork .wqw-x:hover{ background:var(--soft); color:var(--ink); }

/* Body */
#modalQuickwork .wqw-bd{
  flex:1; overflow-y:auto; padding:22px 28px 24px;
  background:var(--soft); min-height:0;
}
#modalQuickwork .wqw-bd::-webkit-scrollbar{ width:11px; }
#modalQuickwork .wqw-bd::-webkit-scrollbar-thumb{
  background:#d8dcd5; border-radius:99px; border:3px solid var(--soft);
}
#modalQuickwork .wqw-wrap{ max-width:1300px; margin:0 auto; }

/* Composition card */
#modalQuickwork .wqw-comp{
  background:var(--paper); border:1px solid var(--line);
  border-radius:16px; overflow:hidden; margin-bottom:18px;
}
#modalQuickwork .wqw-comp-hd{
  background:var(--ink); color:#fff; padding:14px 20px;
  display:flex; align-items:center; justify-content:space-between;
}
#modalQuickwork .wqw-comp-hd .wqw-l{ display:flex; align-items:center; gap:10px; font:700 14px 'Inter'; }
#modalQuickwork .wqw-comp-hd .wqw-l .wqw-cic{ color:#86efac; display:inline-grid; place-items:center; }
#modalQuickwork .wqw-comp-hd .wqw-tot{
  font:700 18px 'Inter'; letter-spacing:-0.01em; color:#86efac;
  font-variant-numeric:tabular-nums;
}

/* Search bank */
#modalQuickwork .wqw-bank-search{
  display:flex; align-items:center; gap:10px;
  padding:12px 20px; border-bottom:1px solid var(--line-2); background:#fafbf9;
  position:relative;
}
#modalQuickwork .wqw-bank-search .wqw-box{
  flex:1; display:flex; align-items:center; gap:10px;
  padding:11px 14px; background:var(--paper); border:1px solid var(--line); border-radius:10px;
}
#modalQuickwork .wqw-bank-search .wqw-box svg{ color:var(--muted); flex-shrink:0; }
#modalQuickwork .wqw-bank-search input{
  flex:1; border:0; outline:none; background:transparent;
  font:500 14px 'Inter'; color:var(--ink);
}
#modalQuickwork .wqw-bank-search input::placeholder{ color:#b3bab0; }
#modalQuickwork .wqw-bank-count{ font:600 11px 'JetBrains Mono'; color:var(--violet); white-space:nowrap; }
#modalQuickwork .wqw-btn-bank{
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 16px; border-radius:10px; border:1px solid var(--violet);
  background:var(--violet-soft); color:var(--violet);
  font:600 13px 'Inter'; cursor:pointer;
}
#modalQuickwork .wqw-btn-bank:hover{ background:#e3dcfb; }

/* Dropdown banque inline */
#modalQuickwork #qwInlineBankResults{
  position:absolute; top:100%; left:20px; right:20px;
  background:var(--paper); border:1px solid var(--line); border-top:none;
  border-radius:0 0 12px 12px; max-height:280px; overflow-y:auto;
  z-index:1000; box-shadow:0 8px 24px rgba(0,0,0,.12);
}

/* Add row labels */
#modalQuickwork .wqw-add-labels{
  display:grid; grid-template-columns: 1fr 70px 110px 80px 90px 110px 64px 48px;
  gap:8px; padding:10px 20px 0;
  background:var(--green-soft);
}
#modalQuickwork .wqw-add-labels span{
  font:600 9px 'JetBrains Mono'; text-transform:uppercase; letter-spacing:.05em; color:var(--green);
}

/* Add row */
#modalQuickwork .wqw-add-row{
  display:grid; grid-template-columns: 1fr 70px 110px 80px 90px 110px 64px 48px;
  gap:8px; padding:8px 20px 14px;
  background:var(--green-soft); border-bottom:2px solid var(--green); align-items:center;
  position:relative;
}
#modalQuickwork .wqw-add-row .wqw-cell{ display:flex; flex-direction:column; gap:5px; position:relative; }
#modalQuickwork .wqw-add-row input,
#modalQuickwork .wqw-add-row select{
  width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:8px;
  font:500 13px 'Inter'; color:var(--ink); background:var(--paper); outline:none;
  height:38px;
}
#modalQuickwork .wqw-add-row input[type="number"]{
  font-family:'JetBrains Mono'; font-weight:600; text-align:right;
}
#modalQuickwork .wqw-add-row input:focus,
#modalQuickwork .wqw-add-row select:focus{
  border-color:var(--green); box-shadow:0 0 0 3px rgba(20,84,58,.12);
}
#modalQuickwork .wqw-add-row select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%236b7565' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 9px center; padding-right:26px; cursor:pointer;
}
#modalQuickwork .wqw-addbtn{
  width:48px; height:38px; border-radius:9px; background:var(--green);
  color:#fff; border:0; display:grid; place-items:center; cursor:pointer; font-weight:700;
}
#modalQuickwork .wqw-addbtn:hover{ background:var(--green-d); }

/* Dropdown suggestions item */
#modalQuickwork #qwItemSuggestionsDropdown{
  position:absolute; top:100%; left:0; right:0; margin-top:2px;
  background:var(--paper); border:1px solid var(--line);
  border-radius:10px; max-height:240px; overflow-y:auto;
  z-index:1000; box-shadow:0 8px 24px rgba(0,0,0,.12);
}

/* Cacher l'ancien header de l'add row legacy (les labels avec couleur violette pour alloc) */
#modalQuickwork .wqw-comp .asm-col-header,
#modalQuickwork .wqw-comp [class*="quick-item-old"]{ display:none !important; }

/* Composition table — rebrand visuel des éléments injectés par renderQwComponents */
#modalQuickwork .wqw-table-wrap{ overflow-x:auto; }
#modalQuickwork .wqw-table-wrap table{
  width:100%; border-collapse:collapse; background:var(--paper);
}
#modalQuickwork .wqw-table-wrap thead{
  background:#fafbf9 !important;
}
#modalQuickwork .wqw-table-wrap thead th{
  text-align:left !important; padding:11px 14px !important;
  font:600 10px 'JetBrains Mono' !important;
  text-transform:uppercase; letter-spacing:.06em;
  color:var(--muted) !important; border-bottom:1px solid var(--line) !important;
  white-space:nowrap; background:#fafbf9 !important; position:sticky; top:0; z-index:2;
}
/* Cacher la colonne Allocation (9e th + 9e td selon décision user) */
#modalQuickwork .wqw-table-wrap thead th:nth-child(9),
#modalQuickwork #qwComponentsBodyScroll td:nth-child(9){
  display:none !important;
}
#modalQuickwork #qwComponentsBodyScroll tr{
  border-bottom:1px solid var(--line-2) !important;
  transition:background .12s ease;
}
#modalQuickwork #qwComponentsBodyScroll tr:hover{ background:#fbfcfa !important; }
#modalQuickwork #qwComponentsBodyScroll td{
  padding:11px 12px !important;
  vertical-align:middle; font-family:'Inter';
}
#modalQuickwork #qwComponentsBodyScroll input[type="number"],
#modalQuickwork #qwComponentsBodyScroll input[type="text"],
#modalQuickwork #qwComponentsBodyScroll select{
  font-family:'JetBrains Mono' !important; font-weight:600 !important;
  border:1px solid var(--line) !important; border-radius:6px !important;
  padding:5px 7px !important; font-size:12px !important; outline:none;
}
#modalQuickwork #qwComponentsBodyScroll input:focus,
#modalQuickwork #qwComponentsBodyScroll select:focus{
  border-color:var(--green) !important;
  box-shadow:0 0 0 2px var(--green-soft) !important;
}

/* Description / Notes card */
#modalQuickwork .wqw-notes{
  background:var(--paper); border:1px solid var(--line); border-radius:16px;
  padding:18px 20px; margin-bottom:18px;
}
#modalQuickwork .wqw-notes h3{
  margin:0 0 14px; font:700 14px 'Inter';
  display:flex; align-items:center; gap:9px; color:var(--ink);
}
#modalQuickwork .wqw-notes h3 .wqw-ic{ color:var(--warn); display:inline-grid; place-items:center; }
#modalQuickwork .wqw-notes textarea,
#modalQuickwork .wqw-notes input[type="text"]{
  width:100%; padding:11px 13px; border:1px solid var(--line);
  border-radius:10px; font:500 14px 'Inter'; color:var(--ink);
  background:var(--paper); outline:none;
}
#modalQuickwork .wqw-notes textarea:focus,
#modalQuickwork .wqw-notes input:focus{
  border-color:var(--green); box-shadow:0 0 0 3px var(--green-soft);
}
#modalQuickwork .wqw-notes textarea{ min-height:90px; resize:vertical; line-height:1.5; }
#modalQuickwork #qwDescriptionEditor{ margin-top:6px; }

/* Footer */
#modalQuickwork .wqw-ft{
  border-top:1px solid var(--line); background:#fff7ed;
  padding:16px 28px; display:flex; align-items:center; gap:24px; flex-shrink:0;
  flex-wrap:wrap;
}
#modalQuickwork .wqw-tot-comp{ display:flex; flex-direction:column; gap:2px; }
#modalQuickwork .wqw-tot-comp .wqw-fl{
  font:600 10px 'JetBrains Mono'; text-transform:uppercase;
  letter-spacing:.06em; color:var(--muted);
}
#modalQuickwork .wqw-tot-comp .wqw-fv{
  font:700 20px 'Inter'; letter-spacing:-0.01em; font-variant-numeric:tabular-nums;
}
#modalQuickwork .wqw-pfinal{ display:flex; flex-direction:column; gap:4px; }
#modalQuickwork .wqw-pfinal .wqw-fl{
  font:600 10px 'JetBrains Mono'; text-transform:uppercase;
  letter-spacing:.06em; color:var(--warn);
  display:flex; align-items:center; gap:5px;
}
#modalQuickwork .wqw-pfinal .wqw-in{ display:flex; align-items:center; gap:6px; }
#modalQuickwork .wqw-pfinal input{
  width:150px; padding:11px 13px;
  border:1.5px solid var(--warn); border-radius:10px;
  font:700 18px 'JetBrains Mono'; text-align:right; color:var(--ink);
  background:#fff; outline:none;
}
#modalQuickwork .wqw-pfinal input:focus{ box-shadow:0 0 0 3px var(--warn-soft); }
#modalQuickwork .wqw-pfinal .wqw-cur{ font:700 16px 'JetBrains Mono'; color:var(--muted); }
#modalQuickwork .wqw-actions{ margin-left:auto; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }

#modalQuickwork .wqw-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 18px; border-radius:11px;
  font:600 14px 'Inter'; border:1px solid var(--line);
  background:var(--paper); color:var(--ink); cursor:pointer;
  white-space:nowrap;
}
#modalQuickwork .wqw-btn:hover{ background:var(--soft); }
#modalQuickwork .wqw-btn.wqw-green{ background:var(--green); color:#fff; border-color:var(--green); }
#modalQuickwork .wqw-btn.wqw-green:hover{ background:var(--green-d); }
#modalQuickwork .wqw-btn.wqw-violet{ background:var(--violet); color:#fff; border-color:var(--violet); }
#modalQuickwork .wqw-btn.wqw-violet:hover{ background:#4a1c92; }
#modalQuickwork .wqw-btn.wqw-create{ background:var(--warn); color:#fff; border-color:var(--warn); }
#modalQuickwork .wqw-btn.wqw-create:hover{ background:#9a4708; }
#modalQuickwork .wqw-btn.wqw-update{ background:var(--green); color:#fff; border-color:var(--green); }
#modalQuickwork .wqw-btn.wqw-update:hover{ background:var(--green-d); }
#modalQuickwork .wqw-btn.wqw-ghost{ border-color:transparent; color:var(--muted); background:transparent; }
#modalQuickwork .wqw-btn.wqw-ghost:hover{ color:var(--ink); background:rgba(0,0,0,.04); }