.principles-tab { padding: 0; height: 100%; display: flex; flex-direction: column; }

.principles-toolbar {
  display: flex; gap: .65rem; align-items: center;
  padding: .55rem .9rem;
  background: rgba(24, 24, 27, .22);
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  flex-wrap: wrap;
  backdrop-filter: blur(24px) saturate(180%);
}
.principles-toolbar label { font-size: .82rem; color: #d4d4d8; display: flex; align-items: center; gap: .3rem; }
.principles-toolbar input[type="search"], .principles-toolbar select, .principles-toolbar button {
  background: rgba(39, 39, 42, .45); color: #e2e8f0;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 6px; padding: .25rem .55rem; font-size: .82rem;
}
.principles-toolbar input[type="search"] { min-width: 220px; font-family: inherit; }
.principles-toolbar .principles-stats {
  margin-left: auto;
  font-family: 'Menlo','Consolas',monospace;
  font-size: .8rem; font-weight: 600;
  display: flex; gap: .4rem;
}

/* ===== Layout 2 col ===== */
.principles-layout { display: grid; grid-template-columns: 240px 1fr; flex: 1; min-height: 0; transition: grid-template-columns .2s; }
.principles-layout.sidebar-hidden { grid-template-columns: 0 1fr; }
.principles-layout.sidebar-hidden #pri-sidebar { visibility: hidden; border-right: none; }

#pri-sidebar {
  background: rgba(20, 20, 23, .25);
  border-right: 1px solid rgba(255, 255, 255, .1);
  overflow-y: auto;
  backdrop-filter: blur(24px) saturate(180%);
}
#pri-tree { list-style: none; margin: 0; padding: .35rem 0; }
#pri-tree .pri-tree-cat {
  display: flex; align-items: center; gap: .5rem;
  padding: .5rem .85rem;
  cursor: pointer;
  border-bottom: 1px solid rgba(255, 255, 255, .03);
  transition: background .12s;
  font-size: .82rem;
}
#pri-tree .pri-tree-cat:hover { background: rgba(var(--p-base-rgb), .07); }
#pri-tree .pri-tree-cat.active {
  background: rgba(var(--p-glow-rgb), .12);
  box-shadow: inset 2px 0 0 var(--p-base);
}
#pri-tree .pri-tree-cat.active .pt-label { color: var(--p-base); font-weight: 500; }
#pri-tree .pt-icon { color: var(--p-base); opacity: .75; flex-shrink: 0; display: inline-flex; align-items: center; }
#pri-tree .pri-tree-cat:hover .pt-icon { opacity: .95; }
#pri-tree .pri-tree-cat.active .pt-icon { opacity: 1; }
#pri-tree .pt-label { color: #e4e4e7; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#pri-tree .pt-badges { display: flex; gap: .2rem; align-items: center; flex-shrink: 0; }
#pri-tree .pt-b {
  font-size: .58rem; font-weight: 700;
  padding: .05rem .32rem; border-radius: 3px; border: 1px solid;
  min-width: 18px; text-align: center; line-height: 1.2;
  font-family: 'Menlo','Consolas',monospace;
}
#pri-tree .pt-b.p0 { color: var(--v2); border-color: var(--v2); background: rgba(var(--v2-rgb), .12); }
#pri-tree .pt-b.p1 { color: #fb923c; border-color: #fb923c; background: rgba(251, 146, 60, .12); }
#pri-tree .pt-b.disabled { color: #64748b; border-color: #64748b; }
#pri-tree .pt-count { color: #64748b; font-size: .68rem; font-family: 'Menlo','Consolas',monospace; }

#pri-main { display: flex; flex-direction: column; background: transparent; position: relative; overflow: hidden; min-height: 0; }
#pri-main .sidebar-handle {
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 12px; height: 64px;
  background: rgba(39, 39, 42, .55);
  border: 1px solid rgba(255, 255, 255, .08); border-left: none;
  border-radius: 0 6px 6px 0;
  color: var(--p-light);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: .9rem; line-height: 1; padding: 0; z-index: 10;
  backdrop-filter: blur(15px);
}
#pri-main .sidebar-handle:hover { background: rgba(var(--p-base-rgb), .18); color: var(--p-base); }

#pri-list { flex: 1; overflow-y: auto; padding: .8rem .9rem; display: flex; flex-direction: column; gap: .4rem; }
.principles-empty { color: #64748b; font-style: italic; padding: 1rem; text-align: center; }

/* ===== Card principe — chrome .card-pri (ref design Vincent 2026-04-29)
   Couleur par PRIORITÉ : P0 rouge, P1 orange, P2 --p-base, P3 turquoise. ===== */
.pri-card {
  --card-rgb: var(--p-base-rgb);   /* fallback */
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
  border-top:    1px solid rgba(var(--card-rgb), .4);
  border-right:  1px solid rgba(var(--card-rgb), .4);
  border-bottom: 1px solid rgba(var(--card-rgb), .4);
  border-left:   2px solid rgba(var(--card-rgb), .9);
  background:
    radial-gradient(circle at top right, rgba(var(--card-rgb), .14), transparent 60%),
    linear-gradient(135deg, rgba(var(--card-rgb), .1) 0%, rgba(var(--card-rgb), .03) 50%, rgba(24, 24, 27, .55) 100%);
  backdrop-filter: blur(28px) saturate(200%);
  -webkit-backdrop-filter: blur(28px) saturate(200%);
  box-shadow: inset 8px 0 14px -8px rgba(var(--card-rgb), .55), inset 0 1px 0 rgba(255, 255, 255, .08), 0 4px 18px rgba(0, 0, 0, .28);
}
.pri-card.p0 { --card-rgb: var(--c-state-alarm-rgb); }
.pri-card.p1 { --card-rgb: var(--c-state-alert-rgb); }
.pri-card.p2 { --card-rgb: var(--p-base-rgb);        }
.pri-card.p3 { --card-rgb: var(--v3-rgb);            }
.pri-card.disabled  { opacity: .5; border-left-style: dashed; }
.pri-card.inviolable { box-shadow: 0 0 12px rgba(var(--card-rgb), .25); } /* halo si inviolable, couleur de la prio */

.pri-card { display: block; }
.pri-card .pc-head {
  display: flex !important;
  align-items: center !important;
  gap: .45rem;
  padding: .5rem .7rem;
  cursor: pointer;
  list-style: none;
  user-select: none;
  min-height: 36px;
  font-size: .85rem;
  color: #e4e4e7;
}
.pri-card.open .pc-chev { transform: rotate(0deg); }
.pri-card .pc-body[hidden] { display: none !important; }
.pri-card .pc-head > * { flex-shrink: 0; }
.pri-card .pc-head > .pc-title {
  flex: 1 1 auto !important;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #e4e4e7 !important;
  font-size: .88rem !important;
  font-weight: 500;
}
.pri-card .pc-chev { color: var(--p-light); opacity: .55; transition: transform .15s; }
.pri-card[open] .pc-chev { transform: rotate(90deg); opacity: 1; }
.pri-card .pc-prio {
  font-size: .58rem; padding: .08rem .35rem; border-radius: 3px; border: 1px solid;
  font-family: 'Menlo','Consolas',monospace; font-weight: 700; letter-spacing: .04em;
}
.pri-card.p0 .pc-prio { color: var(--v2); border-color: var(--v2); background: rgba(var(--v2-rgb), .12); }
.pri-card.p1 .pc-prio { color: #fb923c; border-color: #fb923c; background: rgba(251, 146, 60, .12); }
.pri-card.p2 .pc-prio { color: var(--p-base); border-color: var(--p-base); background: rgba(var(--p-base-rgb), .12); }
.pri-card.p3 .pc-prio { color: var(--v3); border-color: var(--v3); background: rgba(var(--v3-rgb), .12); }

.pri-card .pc-section {
  font-size: .58rem; padding: .08rem .35rem; border-radius: 3px;
  color: var(--p-light); border: 1px solid rgba(var(--p-light-rgb), .35);
  font-family: 'Menlo','Consolas',monospace; text-transform: uppercase; letter-spacing: .04em;
}
.pri-card .pc-scope {
  font-size: .58rem; padding: .08rem .35rem; border-radius: 3px;
  color: #94a3b8; border: 1px solid rgba(255, 255, 255, .08);
  font-family: 'Menlo','Consolas',monospace;
}
.pri-card .pc-source {
  font-size: .56rem; padding: .05rem .3rem; border-radius: 3px;
  color: #64748b; font-family: 'Menlo','Consolas',monospace;
}
.pri-card .pc-source.learned_from_incident { color: #fb923c; }
.pri-card .pc-source.claude_proposed { color: var(--p-base); }
.pri-card .pc-title {
  color: #e4e4e7; font-size: .88rem; font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 0;
}
.pri-card .pc-lock { color: var(--v2); font-size: .9rem; opacity: .6; }
.pri-card .pc-actions { display: flex; gap: .2rem; }
.pri-card .pc-actions button {
  background: transparent; border: 1px solid rgba(255, 255, 255, .08);
  color: #94a3b8;
  border-radius: 3px;
  padding: .2rem .35rem;
  cursor: pointer;
  display: inline-flex; align-items: center;
}
.pri-card .pc-actions button:hover:not(:disabled) {
  background: rgba(var(--p-base-rgb), .12);
  border-color: rgba(var(--p-base-rgb), .35);
  color: var(--p-base);
}
.pri-card .pc-actions button:disabled { opacity: .35; cursor: not-allowed; }

.pri-card .pc-body {
  padding: .55rem .85rem .75rem 1.7rem;
  border-top: 1px dashed rgba(255, 255, 255, .07);
  color: #d4d4d8;
  font-size: .84rem;
  line-height: 1.55;
  white-space: pre-wrap;
}
.pri-card .pc-meta {
  margin-top: .55rem;
  font-size: .72rem;
  color: #94a3b8;
  font-family: 'Menlo','Consolas',monospace;
  display: flex; gap: 1rem; flex-wrap: wrap;
}
.pri-card .pc-examples {
  margin-top: .55rem;
  display: grid; grid-template-columns: 1fr 1fr; gap: .5rem;
}
.pri-card .pc-ex-block {
  padding: .4rem .55rem;
  border-radius: 4px;
  font-size: .76rem;
}
.pri-card .pc-ex-block.good { background: rgba(var(--v4-rgb), .06); border-left: 2px solid var(--v4); color: #d1fae5; }
.pri-card .pc-ex-block.bad  { background: rgba(var(--v2-rgb), .06); border-left: 2px solid var(--v2); color: #fecaca; }
.pri-card .pc-ex-h { font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; opacity: .8; margin-bottom: .25rem; }
.pri-card .pc-ex-block ul { margin: 0; padding-left: 1.1rem; }

/* Modal "Analyser" : résultat structuré */
#pri-analyze-content h3 { margin: .8rem 0 .35rem; color: var(--p-light); font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; }
#pri-analyze-content ul { margin: .15rem 0; padding-left: 1.4rem; }
#pri-analyze-content li { margin: .15rem 0; }
#pri-analyze-content .ana-score {
  display: inline-block; padding: .35rem .8rem; border-radius: 5px; font-weight: 700;
  font-size: 1.4rem; border: 2px solid; font-family: 'Menlo','Consolas',monospace;
}
#pri-analyze-content .ana-score.s-good   { color: var(--v4); border-color: var(--v4); background: rgba(var(--v4-rgb), .1); }
#pri-analyze-content .ana-score.s-medium { color: #fb923c; border-color: #fb923c; background: rgba(251, 146, 60, .1); }
#pri-analyze-content .ana-score.s-bad    { color: var(--v2); border-color: var(--v2); background: rgba(var(--v2-rgb), .1); }
#pri-analyze-content .ana-summary { color: #d4d4d8; font-size: .9rem; line-height: 1.55; padding: .55rem .75rem; background: rgba(0, 0, 0, .15); border-left: 3px solid var(--p-base); border-radius: 0 4px 4px 0; margin-top: .5rem; }

/* ============================================================================
   STANDARD TOOLBAR — uniforme reference Biometrie sante (Vincent 2026-05-10)
   Zone figee (min-height 3.15rem) + controls cohérents (bg .45, radius 6, h 28).
   ============================================================================ */
.principles-toolbar {
  min-height: 3.15rem !important;
  box-sizing: border-box !important;
}
.principles-toolbar input[type="search"],
.principles-toolbar input[type="text"],
.principles-toolbar input[type="date"],
.principles-toolbar input[type="number"],
.principles-toolbar select,
.principles-toolbar button.t-btn {
  background: rgba(39, 39, 42, .45);
  color: #e2e8f0;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 6px;
  padding: .22rem .55rem;
  font-size: .82rem;
  font-family: 'Menlo','Consolas',monospace;
  height: 28px;
  box-sizing: border-box;
  line-height: 1.2;
}
.principles-toolbar button.t-btn:hover:not(:disabled) {
  background: rgba(var(--p-base-rgb), .18);
  color: var(--p-base);
  border-color: rgba(var(--p-base-rgb), .35);
}
.principles-toolbar label {
  font-size: .82rem;
  color: #d4d4d8;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  line-height: 1.2;
}