/*! Task’in — © 2026 Fandry Ekwalla. Tous droits réservés. Copie, modification et diffusion interdites sans autorisation écrite (voir LICENSE). */
/* ===== P1 : FILTRES DATE ===== */
.date-filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.date-filter-bar label{font-size:11px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.4px}
.date-input{padding:7px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:var(--mono);font-size:12px;outline:none;cursor:pointer}
.date-input:focus{border-color:var(--ocean)}
.date-action-btn{padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text2);font-family:var(--font);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.date-action-btn.pending{border-color:var(--ocean);background:var(--ocean);color:#fff}
.date-action-btn.pending:hover{background:var(--ocean-deep)}
.date-action-btn.applied{border-color:var(--red);color:var(--red-ink)}
.date-action-btn.applied:hover{background:var(--red-dim)}
.date-sep{color:var(--text3);font-size:13px}

/* ===== P2 : LEADERBOARD ===== */
#tab-leaderboard{display:inline-flex}
/* Visibilité gérée par la classe .hidden (une règle display:none ici masquait le classement partout). */
.lb-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.lb-period-btn{padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-family:var(--font);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.lb-period-btn.active{background:var(--ocean);color:#fff;border-color:var(--ocean)}
.lb-table{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.lb-table table{width:100%;border-collapse:collapse}
.lb-table th{font-size:10px;font-weight:700;color:var(--text2);text-align:left;padding:11px 16px;border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.6px;background:var(--surface2);cursor:pointer;user-select:none;white-space:nowrap}
.lb-table th:hover{color:var(--ocean-ink)}
.lb-table th .sort-arrow{margin-left:4px;opacity:.4;font-size:10px}
.lb-table th.sorted .sort-arrow{opacity:1;color:var(--ocean-ink)}
.lb-table td{font-size:13px;padding:12px 16px;border-bottom:1px solid var(--border)}
.lb-table tr:last-child td{border-bottom:none}
.lb-table tr:hover td{background:var(--surface2)}
.lb-rank{font-family:var(--mono);font-weight:700;color:var(--text3);font-size:13px}
.lb-rank.r1{color:#DCAE1D}.lb-rank.r2{color:#9AA6B8}.lb-rank.r3{color:#C9604F}
.lb-medal{font-size:16px}
.lb-val{font-family:var(--mono);font-size:13px;color:var(--text)}
.lb-val.good{color:var(--green-ink)}.lb-val.warn{color:var(--amber-ink)}.lb-val.bad{color:var(--red-ink)}

/* ===== P3 : MATRICE CANAUX ===== */
#channel-matrix-panel{display:none;margin-bottom:16px}
.matrix-controls{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
.matrix-toggle-group{display:flex;gap:4px;background:var(--surface2);border:1px solid var(--border);border-radius:9px;padding:3px}
.matrix-toggle{padding:5px 12px;border-radius:7px;border:none;background:transparent;color:var(--text2);font-family:var(--font);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.matrix-toggle.active{background:var(--ocean);color:#fff}
.channel-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;margin-bottom:12px}
.channel-card-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.channel-card-title{font-weight:700;font-size:14px;color:var(--text)}
.channel-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.channel-kpi{background:var(--surface2);border-radius:8px;padding:10px 12px;text-align:center}
.channel-kpi-val{font-family:var(--display);font-size:20px;font-weight:600;color:var(--ocean-ink)}
.channel-kpi-label{font-size:10px;color:var(--text2);text-transform:uppercase;letter-spacing:.4px;margin-top:2px}
.channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:800px){.channel-grid{grid-template-columns:1fr}}
.channel-filter-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.channel-filter-btn{padding:6px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-family:var(--font);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.channel-filter-btn.active{background:var(--ocean);color:#fff;border-color:var(--ocean)}
#app.role-supervisor #tab-supervision{order:-1}

.sv-tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.sv-tab-btn{padding:8px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-family:var(--font);font-size:12.5px;font-weight:600;cursor:pointer}
.sv-tab-btn.active{background:var(--ocean);color:#fff;border-color:var(--ocean)}
.sv-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:12px;cursor:pointer}
.sv-card:hover{border-color:var(--ocean)}
.sv-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.sv-card-title{font-weight:700;font-size:14.5px;color:var(--text)}
.sv-card-meta{font-size:11.5px;color:var(--text2);margin-top:3px}
.sv-pill{display:inline-block;padding:3px 10px;border-radius:20px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}
.sv-pill-low{background:var(--surface2);color:var(--text2)}
.sv-pill-medium{background:var(--amber-dim);color:var(--amber-ink)}
.sv-pill-high{background:var(--clay-dim);color:var(--red-ink)}
.sv-pill-urgent{background:var(--red-dim);color:var(--red-ink)}
.sv-pill-nouveau{background:var(--ocean-dim);color:var(--ocean-ink)}
.sv-pill-en_cours{background:var(--amber-dim);color:var(--amber-ink)}
.sv-pill-attente_client{background:var(--bloom-dim);color:var(--bloom)}
.sv-pill-resolu{background:var(--green-dim);color:var(--green-ink)}
.sv-pill-overdue{background:var(--red);color:#fff}
.sv-empty{color:var(--text2);font-size:13px;padding:28px;text-align:center}
.sv-score-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sv-score-row label{flex:0 0 150px;font-size:12.5px;color:var(--text2)}
.sv-score-row input[type=range]{flex:1}
.sv-score-val{width:26px;text-align:center;font-weight:700;color:var(--ocean-ink);font-family:var(--mono)}
.sv-obj-row{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.sv-obj-row input[type=text]{flex:1}
.sv-obj-row select{flex:0 0 120px}
.sv-grid-pilier{border:1px solid var(--border);border-radius:10px;margin-bottom:10px;overflow:hidden}
.sv-grid-pilier summary{background:var(--surface2);padding:10px 14px;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;list-style:none}
.sv-grid-pilier summary::-webkit-details-marker{display:none}
.sv-grid-pilier-pct{margin-left:auto;font-family:var(--mono);font-size:12px;font-weight:700;padding:2px 8px;border-radius:20px;background:var(--surface);color:var(--text2)}
.sv-grid-item{display:flex;align-items:center;gap:10px;padding:8px 14px;border-top:1px solid var(--border)}
.sv-grid-item-label{flex:1;font-size:12.5px;color:var(--text)}
.sv-grid-cible{color:var(--text2);font-family:var(--mono);font-size:11px}
.sv-grid-select{flex:0 0 170px;font-size:12px;padding:6px 8px}
.sv-grid-item-si{background:var(--red-dim)}
.sv-si-toggle{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--red-ink);font-weight:600;flex:0 0 170px;justify-content:flex-end}

/* ===== P4 : DRAG & DROP TRAITEMENTS ===== */
.treatment-row{cursor:grab;transition:background .15s,box-shadow .15s}
.treatment-row.dragging{opacity:.4;cursor:grabbing}
.treatment-row.drag-over{background:var(--ocean-dim);box-shadow:0 0 0 2px var(--ocean) inset}
.treat-drag-handle{color:var(--text3);font-size:14px;cursor:grab;padding:0 6px;user-select:none}
.treat-order-btn{width:22px;height:22px;border-radius:5px;border:1px solid var(--border);background:var(--surface2);color:var(--text2);font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}
.treat-order-btn:hover{border-color:var(--ocean);color:var(--ocean-ink)}
.treat-order-btns{display:flex;flex-direction:column;gap:2px;margin-right:6px}
.treat-priority-badge{font-size:9px;padding:2px 6px;border-radius:99px;background:var(--ocean-dim);color:var(--ocean-ink);font-weight:700;letter-spacing:.3px;margin-left:6px}

/* ===== FEAT 1 : PDF PRINT ===== */
@media print {
  body * { visibility: hidden !important; }
  #lb-print-zone, #lb-print-zone * { visibility: visible !important; }
  #lb-print-zone { position: fixed; inset: 0; padding: 32px; background: #fff; }
  .lb-print-header { margin-bottom: 20px; }
  .lb-print-title { font-family: serif; font-size: 22px; font-weight: 700; color: #2B4C7E; }
  .lb-print-sub { font-size: 12px; color: #6B7C93; margin-top: 4px; }
  .lb-table table { width: 100%; border-collapse: collapse; }
  .lb-table th, .lb-table td { border: 1px solid #E2E8F0; padding: 8px 12px; font-size: 12px; }
  .lb-table th { background: #2B4C7E; color: #fff; }
}

/* ===== FEAT 2 : HISTOGRAMME 7J AGENT ===== */
.agent-history-bar { margin: 20px 24px 0; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; }
.agent-history-title { font-size: 11px; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 12px; }
.agent-history-bars { display: flex; align-items: flex-end; gap: 6px; height: 60px; }
.agent-hbar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; height: 100%; }
.agent-hbar { width: 100%; border-radius: 3px 3px 0 0; min-height: 2px; background: var(--border2); transition: background .15s; cursor: default; position: relative; }
.agent-hbar.today { background: var(--ocean); }
.agent-hbar.has-data:hover { opacity: .8; }
.agent-hbar-label { font-family: var(--mono); font-size: 9px; color: var(--text3); }
.agent-hbar-val { font-family: var(--mono); font-size: 9px; color: var(--text2); }

/* ===== FEAT 3 : BARRES KPI OBJECTIF ===== */
.kpi-progress-bar { height: 4px; border-radius: 2px; background: var(--border); margin-top: 8px; overflow: hidden; }
.kpi-progress-fill { height: 100%; border-radius: 2px; transition: width .4s ease; }
.kpi-progress-fill.good { background: var(--green); }
.kpi-progress-fill.warn { background: #DCAE1D; }
.kpi-progress-fill.bad { background: var(--red); }
.kpi-goal-label { font-size: 10px; color: var(--text3); margin-top: 3px; }
.goals-section { padding: 14px 18px; border-top: 1px solid var(--border); }
.goals-section h4 { font-size: 12px; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 12px; }
.goal-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.goal-row label { font-size: 12px; color: var(--text); flex: 1; }
.goal-input { width: 70px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 6px; font-size: 12px; font-family: var(--mono); background: var(--surface2); color: var(--text); outline: none; }
.goal-input:focus { border-color: var(--ocean); }
.goal-unit { font-size: 11px; color: var(--text2); width: 40px; }

/* ===== FEAT 5 : TABLE SCROLLABLE ===== */
.entries-table-wrap { max-height: 520px; overflow-y: auto; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); }
.entries-table-wrap table { width: 100%; border-collapse: collapse; min-width: 800px; }
.entries-table-wrap thead th { position: sticky; top: 0; z-index: 2; font-size: 10px; font-weight: 700; color: var(--text2); text-align: left; padding: 11px 16px; border-bottom: 1px solid var(--border); text-transform: uppercase; letter-spacing: .6px; background: var(--surface2); }
.entries-table-wrap td { font-size: 13px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.entries-table-wrap tr:last-child td { border-bottom: none; }
.entries-table-wrap tr:hover td { background: var(--surface2); }
.entries-table-wrap tr:hover .row-actions { opacity: 1; }

/* ===== FEAT 8 : DONUT CHART ===== */
.donut-section { padding: 20px 18px; border-top: 1px solid var(--border); }
.donut-section-title { font-size: 11px; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 16px; }
.donut-layout { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.donut-legend { flex: 1; min-width: 160px; }
.donut-legend-item { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 12px; color: var(--text); }
.donut-legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.donut-legend-pct { font-family: var(--mono); font-size: 11px; color: var(--text2); margin-left: auto; }

/* ===== P3 : MOSAÏQUE KPI AGENTS ===== */
.mosaic-header{display:flex;align-items:center;justify-content:space-between;margin:20px 0 12px;flex-wrap:wrap;gap:10px}
.mosaic-header h3{font-family:var(--display);font-size:15px;font-weight:600;color:var(--text)}
.mosaic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-bottom:20px}
.mosaic-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;cursor:pointer;transition:box-shadow .15s,border-color .15s;position:relative}
.mosaic-card:hover{border-color:var(--ocean);box-shadow:0 4px 16px rgba(43,76,126,.1)}
.mosaic-card-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.mosaic-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;font-family:var(--font);background-size:cover;background-position:center;position:relative}
.mosaic-status-dot{position:absolute;bottom:0;right:0;width:10px;height:10px;border-radius:50%;border:2px solid var(--surface)}
.mosaic-status-dot.active{background:var(--green)}
.mosaic-status-dot.idle{background:var(--text3)}
.mosaic-agent-name{font-size:13px;font-weight:600;color:var(--text)}
.mosaic-agent-task{font-size:11px;color:var(--text2);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px}
.mosaic-kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mosaic-kpi{background:var(--surface2);border-radius:8px;padding:8px 10px;text-align:center}
.mosaic-kpi-val{font-family:var(--display);font-size:17px;font-weight:600;color:var(--ocean-ink)}
.mosaic-kpi-label{font-size:9px;color:var(--text2);text-transform:uppercase;letter-spacing:.4px;margin-top:2px}
.mosaic-timer{font-family:var(--mono);font-size:10px;color:var(--text3);margin-left:auto;flex-shrink:0}
.mosaic-period-btn{padding:4px 10px;border-radius:6px;border:none;background:transparent;color:var(--text2);font-family:var(--font);font-size:11px;font-weight:600;cursor:pointer;transition:all .15s}
.mosaic-period-btn.active{background:var(--ocean);color:#fff}

/* ===== DOCUMENTATION ===== */
.doc-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.doc-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.doc-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;cursor:pointer;transition:border-color .15s}
.doc-card:hover{border-color:var(--ocean)}
.doc-card-title{font-family:var(--display);font-size:15px;font-weight:600;color:var(--text);margin-bottom:6px}
.doc-card-desc{font-size:12px;color:var(--text2);margin-bottom:10px;line-height:1.4}
.doc-tag{font-size:10px;background:var(--surface2);color:var(--text2);padding:3px 8px;border-radius:99px;margin-right:4px;border:1px solid var(--border)}
.doc-format-badge{font-size:10px;padding:3px 9px;border-radius:99px;font-weight:600;display:inline-block;margin-top:8px}
.doc-fmt-narrative{background:var(--ocean-dim);color:var(--ocean-ink)}
.doc-fmt-action_table{background:var(--green-dim);color:var(--green-ink)}
.doc-fmt-supplier_guide{background:var(--amber-dim);color:var(--amber-ink)}
.doc-fmt-role_guide{background:var(--bloom-dim);color:#A34C68}
.doc-fmt-hybrid{background:var(--clay-dim);color:var(--red-ink)}
.doc-empty{color:var(--text3);font-style:italic;padding:40px;text-align:center;grid-column:1/-1}
.doc-import-banner{background:var(--amber-dim);border:1px solid var(--amber);color:#8A6A0E;border-radius:9px;padding:10px 14px;font-size:12px;margin-bottom:14px}
.doc-dropzone{border:2px dashed var(--border);border-radius:10px;padding:26px;text-align:center;color:var(--text2);font-size:13px;cursor:pointer;margin:10px 0}
.doc-dropzone:hover{border-color:var(--ocean)}
.doc-dropzone.dragover{border-color:var(--ocean);background:var(--ocean-dim)}
.doc-block{border:1px solid var(--border);border-radius:9px;padding:10px;margin-bottom:8px;background:var(--surface2)}
.doc-block-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.doc-block-head select{font-size:12px;padding:3px 6px;width:auto}
.doc-block-actions{display:flex;gap:4px}
.doc-block-actions button{font-size:11px;padding:3px 7px}
.doc-table-row{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr auto;gap:6px;margin-bottom:6px}
.doc-table-row input,.doc-table-row textarea{font-size:12px;padding:6px}
.doc-list-row{display:flex;gap:6px;margin-bottom:6px}
.doc-list-row input{flex:1}
.doc-read-block{margin-bottom:14px;font-size:13px;line-height:1.5}
.doc-read-callout{background:var(--ocean-dim);border-radius:9px;padding:10px 14px}
.doc-read-table{width:100%;border-collapse:collapse;font-size:12px}
.doc-read-table th{background:var(--ocean);color:#fff;text-align:left;padding:8px}
.doc-read-table td{border-bottom:1px solid var(--border);padding:8px;vertical-align:top}

.doc-read-callout-info{background:var(--ocean-dim);color:var(--ocean-ink)}
.doc-read-callout-warning{background:var(--amber-dim);color:#8A6A0E}
.doc-read-callout-important{background:var(--clay-dim);color:var(--red-ink)}

.doc-read-group-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;color:var(--text2);margin:14px 0 8px}
.doc-read-group-urgent{color:var(--red-ink)}
.doc-read-urgent-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.doc-urgent-card{border-left:3px solid var(--clay);background:var(--clay-dim);border-radius:0 9px 9px 0;padding:12px 14px}
.doc-urgent-card-head{display:flex;justify-content:space-between;align-items:flex-start}
.doc-urgent-card-title{font-size:13.5px;font-weight:600;color:var(--text)}
.doc-urgent-badge{font-size:10px;background:var(--clay);color:#fff;padding:2px 8px;border-radius:20px;flex-shrink:0}
.doc-urgent-card-subject{font-size:12px;color:var(--text2);margin-top:2px}
.doc-urgent-card-actions{margin-top:8px;font-size:12.5px;color:var(--text);line-height:1.5}
.doc-urgent-card-notes{margin-top:6px;font-size:12px;color:#8A6A0E;background:var(--amber-dim);border-radius:6px;padding:6px 10px}

.doc-read-other-list{display:flex;flex-direction:column;gap:6px}
.doc-collapsed-row{border:1px solid var(--border);border-radius:8px}
.doc-collapsed-row-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;cursor:pointer}
.doc-collapsed-row-title{font-size:13px;color:var(--text)}
.doc-collapsed-chevron{font-size:12px;color:var(--text2)}
.doc-collapsed-row-detail{padding:0 12px 12px;font-size:12.5px;color:var(--text);line-height:1.5}
.doc-collapsed-notes{color:#8A6A0E;background:var(--amber-dim);border-radius:6px;padding:6px 10px}

.agent-cell .lb-days{margin-left:6px;padding:1px 6px;border-radius:99px;background:var(--surface2);color:var(--text2);font-size:10.5px;font-weight:700}