/* ============================================================
   Playbook Admin — layout deux colonnes + zone contenu + aperçu IA
   À inclure dans le fichier CSS global de l'application cliente
   (ex: AssistantIa.css ou ls-ai-compliance-admin.css)
   ============================================================ */
 
/* ─── Layout deux colonnes ─────────────────────────────────────────────── */
 
/*
* Quand le panneau IA est actif, le detailPanel se transforme en flex row.
* Le form XML (existant, géré par AdminFileTab) prend 55%,
* le PlaybookAiPreviewPanel prend 45%.
*/
.pcw-detail-two-col {
    display: flex !important;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
    height: 100%;
    overflow: hidden;
}
 
/* Le form XML existant — prend 55% */
.pcw-detail-two-col > .x-panel,
.pcw-detail-two-col > .x-form-panel,
.pcw-detail-two-col > .ls-ai-compliance-admin > .x-panel {
    flex: 0 0 55% !important;
    width: 55% !important;
    max-width: 55%;
    overflow-y: auto;
    border-right: 1px solid #e8e8ee;
}
 
/* Panneau IA — prend 45% */
.pap-root {
    flex: 0 0 45% !important;
    width: 45% !important;
    max-width: 45%;
    overflow-y: auto;
    background: #f7f7fb;
    border-left: 1px solid #e8e8ee;
    display: flex;
    flex-direction: column;
}
 
/* ─── PlaybookAiPreviewPanel ────────────────────────────────────────────── */
 
.pap-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid #e8e8ee;
    font-size: 13px;
    font-weight: 600;
    color: #2d2d4e;
    background: #fff;
}
 
.pap-header-icon {
    font-size: 15px;
}
 
.pap-section {
    padding: 14px 16px;
    border-bottom: 1px solid #e8e8ee;
}
 
.pap-section-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #888;
    margin-bottom: 10px;
}
 
.pap-section-icon {
    font-size: 13px;
}
 
/* Grille métriques : 2 colonnes */
.pap-metric-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
 
.pap-metric-card {
    background: #fff;
    border: 1px solid #e8e8ee;
    border-radius: 8px;
    padding: 10px 12px;
}
 
.pap-metric-icon {
    font-size: 16px;
    margin-bottom: 4px;
}
 
.pap-icon-purple { color: #7F77DD; }
.pap-icon-teal   { color: #1D9E75; }
.pap-icon-amber  { color: #BA7517; }
.pap-icon-blue   { color: #185FA5; }
 
.pap-metric-val {
    font-size: 20px;
    font-weight: 700;
    color: #2d2d4e;
    line-height: 1;
}
 
.pap-metric-label {
    font-size: 10px;
    color: #888;
    margin-top: 3px;
}
 
/* ── Statut ── */
 
.pap-status-section {
    /* hérite de .pap-section */
}
 
.pap-status-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
 
.pap-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}
 
.pap-badge-done     { background: #edf7ed; color: #2e7d32; }
.pap-badge-progress { background: #e3f0fd; color: #1565C0; }
.pap-badge-failed   { background: #fdecea; color: #c62828; }
 
/* Pastille pulsante pour IN_PROGRESS */
.pap-pulse {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #1565C0;
    animation: pap-pulse-anim 1.4s ease-in-out infinite;
}
 
@keyframes pap-pulse-anim {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.25; }
}
 
/* Checkbox keepUserClauses */
.pap-keep-clauses-cb {
    margin-top: 6px;
    font-size: 12px;
    color: #555;
}
 
/* ── Bouton Clauses ── */
 
.pap-clauses-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 16px 0;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #d0d0e0;
    border-radius: 8px;
    cursor: pointer;
    font-size: 12px;
    color: #2d2d4e;
    transition: border-color 0.15s, background 0.15s;
}
 
.pap-clauses-btn:hover {
    border-color: #7F77DD;
    background: #f0efff;
}
 
.pap-clauses-btn-label {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #2d2d4e;
    font-size: 12px;
}
 
.pap-clauses-btn-right {
    display: flex;
    align-items: center;
    gap: 6px;
}
 
.pap-count-badge {
    background: #7F77DD;
    color: #fff;
    border-radius: 10px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
}
 
.pap-chevron {
    font-size: 16px;
    color: #aaa;
}
 
/* ── Bouton Relancer ── */
 
.pap-relaunch-wrap {
    padding: 8px 16px 0;
}
 
.pap-relaunch-btn {
    width: 100%;
    background: #7F77DD !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 9px 0 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    cursor: pointer;
    text-align: center;
}
 
.pap-relaunch-btn:hover {
    background: #534AB7 !important;
}
 
/* ── Note sécurité ── */
 
.pap-security-note {
    margin: 12px 16px 16px;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid #e8e8ee;
    border-radius: 8px;
    display: flex;
    align-items: flex-start;
    gap: 7px;
    font-size: 11px;
    color: #666;
    line-height: 1.4;
}
 
.pap-security-icon {
    font-size: 14px;
    color: #1D9E75;
    flex-shrink: 0;
    margin-top: 1px;
}
 
 
/* ─── PlaybookContentZone ───────────────────────────────────────────────── */
 
.pcz-root {
    margin-bottom: 12px;
}
 
/* Ligne label + lien Vider */
.pcz-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
}
 
.pcz-field-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #555;
}
 
.pcz-field-hint {
    font-size: 10px;
    color: #aaa;
    font-weight: 400;
    margin-left: 5px;
    text-transform: none;
    letter-spacing: 0;
}
 
.pcz-back-link {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 3px;
}
 
.pcz-back-link-inner {
    font-size: 11px;
    color: #7F77DD;
    text-decoration: underline;
    cursor: pointer;
}
 
.pcz-back-link-inner:hover {
    color: #534AB7;
}
 
/* Drop zone */
.pcz-drop-zone {
    /* Le DropFileUploadPanel GXT génère son propre élément ;
       on stylise son wrapper interne via pcz-dz-inner */
}
 
.pcz-dz-inner {
    border: 1.5px dashed #c0bfdb;
    border-radius: 8px;
    padding: 24px 12px;
    text-align: center;
    background: #f7f7fb;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
 
.pcz-dz-inner:hover,
.drop-file-over .pcz-dz-inner {
    border-color: #7F77DD;
    background: #f0efff;
}
 
.pcz-dz-icon {
    font-size: 30px;
    color: #aaa;
    margin-bottom: 8px;
    line-height: 1;
}
 
.pcz-dz-title {
    font-size: 13px;
    font-weight: 600;
    color: #2d2d4e;
    margin-bottom: 3px;
}
 
.pcz-dz-sub {
    font-size: 11px;
    color: #aaa;
    margin-bottom: 12px;
}
 
.pcz-dz-btns {
    display: flex;
    gap: 8px;
    justify-content: center;
}
 
.pcz-btn-primary {
    background: #7F77DD;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 7px 14px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}
 
.pcz-btn-primary:hover { background: #534AB7; }
 
.pcz-btn-secondary {
    background: #fff;
    color: #2d2d4e;
    border: 1px solid #d0d0e0;
    border-radius: 6px;
    padding: 7px 14px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}
 
.pcz-btn-secondary:hover {
    border-color: #7F77DD;
    color: #7F77DD;
}
 
/* Pill fichier importé */
.pcz-file-pill {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    background: #f7f7fb;
    border: 1px solid #e8e8ee;
    border-radius: 6px;
    margin-top: 6px;
    font-size: 12px;
    color: #2d2d4e;
}
 
.pcz-pill-icon {
    font-size: 16px;
    color: #7F77DD;
    flex-shrink: 0;
}
 
.pcz-pill-name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
 
.pcz-pill-remove {
    margin-left: auto;
    cursor: pointer;
    color: #aaa;
    font-size: 13px;
    flex-shrink: 0;
    padding: 2px 4px;
    border-radius: 4px;
    transition: color 0.1s, background 0.1s;
}
 
.pcz-pill-remove:hover {
    color: #c62828;
    background: #fdecea;
}
 
/* Éditeur (wrap du rich-text GXT existant) */
.pcz-editor-wrap {
    border: 1px solid #d0d0e0;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 4px;
}
 
/* S'assure que le rich-text GXT à l'intérieur prend toute la largeur */
.pcz-editor-wrap .x-form-field-wrap,
.pcz-editor-wrap textarea,
.pcz-editor-wrap .x-html-editor-wrap {
    width: 100% !important;
    border: none !important;
    border-radius: 0 !important;
}

.pcw-toggle-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    background: #f7f7fb;
    border-radius: 8px;
    margin-bottom: 4px;
}

.editorWrap {
	padding-top: 15px;
}
.editorWrap .x-form-textarea {
	width:100% !important;
}

.editorWrap .x-form-field-wrap {
	height: 100% !important;
}

.ls-ai-compliance-admin .slide-admin-panel .x-form-readonly.pcw-field-input input {
	border: none;
}

.editorWrap .pcw-content-editor:not(.x-form-readonly) {
    border: 1px solid var(--septeo-full-color-grey-grey-30);
    border-radius: 8px;
}

/* ── Page Header Compliance playbook ── */
.cpb-page-header {
    padding: 16px 20px 12px 20px;
    background: #fff;
     overflow: hidden;
     text-overflow: ellipsis;
   /*border-bottom: 1px solid #e8eaf0; */
}
.cpb-page-header-inner {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}
/*
.cpb-page-header-text {
	
}*/

.cpb-page-header-icon {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, #c5c2f9 0%, #ffffff 100%);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.cpb-page-header-icon-img {
    width: 36px;
    height: 36px;
    object-fit: contain;
}
.cpb-page-header-icon-inner {
    font-size: 22px;
}
.cpb-page-header-title {
    font-size: 18px;
    font-weight: 700;
    color: #1a1a2e;
    line-height: 1.3;
    margin-bottom: 4px;
}
.cpb-page-header-sub {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.4;
}
.form-toolbar-title {
    display: none !important;
}

/* ── Section badges ── */
.cpb-section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 4px 0;
}
.cpb-section-badge {
    width: 28px;
    height: 28px;
    background: #304287;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}
.cpb-section-header-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
	max-width: 100%;
  	white-space: normal;       /* permet le retour à la ligne */
  	word-wrap: break-word;     /* casse les mots longs */
  	overflow-wrap: break-word; /* standard moderne */
    
}
.cpb-section-header-title {
    font-size: 15px;
    font-weight: 700;
    color: #1a1a2e;
}
.cpb-section-header-sub {
    font-size: 12px;
    color: #6b7280;
    font-weight: 400;
}

/* ── Panel droit global ── */
.cpb-preview-panel {
    width: 280px;
    min-width: 260px;
    max-width: 300px;
    padding: 16px;
    background: #fff;
    border-left: 1px solid #e8eaf0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ── État du playbook ── */
.cpb-state-panel {
    background: #fff;
    border: 1px solid #e8eaf0;
    border-radius: 12px;
    padding: 16px;
}
.cpb-state-title {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 16px;
}

/* ── Stepper ── */
.cpb-stepper-new { display: flex; flex-direction: column; }
.cpb-step-row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.cpb-step-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
}
.cpb-step-circle {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}
.cpb-step-done    { background: green; color: #fff; }
.cpb-step-active  { background: #fff3cd; color: #856404; border: 2px solid #ffc107; }
.cpb-step-pending { background: #f0f0f0; color: #aaa; }
.cpb-step-line {
    width: 2px;
    flex: 1;
    min-height: 20px;
    background: #e8eaf0;
    margin: 4px 0;
}
.cpb-step-content { padding-bottom: 16px; }
.cpb-step-row-last .cpb-step-content { padding-bottom: 0; }
.cpb-step-title {
    font-size: 13px;
    font-weight: 600;
    color: #1a1a2e;
    line-height: 1.3;
}
.cpb-step-sub {
    font-size: 11px;
    color: #6b7280;
    margin-top: 2px;
    white-space: normal;
}

/* ── Aperçu ── */
.cpb-apercu-panel {
    background: #fff;
    border: 1px solid #e8eaf0;
    border-radius: 12px;
    padding: 16px;
}
.cpb-apercu-title {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 4px;
}
.cpb-apercu-sub {
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 16px;
}
.cpb-apercu-stats {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}
.cpb-apercu-stat {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}
.cpb-apercu-stat-icon { font-size: 18px; }
.cpb-apercu-stat-value {
    font-size: 28px;
    font-weight: 800;
    color: #1a1a2e;
    line-height: 1;
}
.cpb-apercu-stat-label {
    font-size: 11px;
    color: #6b7280;
}

/* ── CTA ── */
.cpb-cta-btn {
    width: 100%;
    padding: 12px;
    background: #304287;
    color: #fff;
    border-radius: 8px;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    box-sizing: border-box;
    transition: background 0.2s;
}
.cpb-cta-btn:hover { background: #5a52d5; }
.cpb-cta-disabled  { background: #c0bdf8; cursor: default; }
.cpb-cta-reanalyze { background: #f0f0f0; color: #304287; }
.cpb-cta-reanalyze:hover { background: #e0dfff; }

.cpb-cta-btn.cpb-cta-disabled {
    background: #e2e2e2;
    color: #9a9a9a;
    border: 1px solid #d0d0d0;
    cursor: not-allowed;
    opacity: 0.7;
    box-shadow: none;
}

/* ── Ouvrir la revue ── */
.cpb-preview-open-btn {
    width: 100%;
    padding: 12px;
    background: #304287;
    color: #fff;
    border-radius: 8px;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    box-sizing: border-box;
}
.cpb-preview-open-btn:hover { background: #5a52d5; }

/* ── Sécurité ── */
.cpb-preview-security {
    background: #f8f7ff;
    border: 1px solid #e0dfff;
    border-radius: 12px;
    padding: 14px;
    position: relative;
    overflow: hidden;
}
.cpb-security-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
.cpb-preview-security-icon { font-size: 16px; }
.cpb-preview-security-title {
    font-size: 13px;
    font-weight: 700;
    color: #304287;
}
.cpb-preview-security-text {
    font-size: 12px;
    color: #6b7280;
    line-height: 1.5;
}
.cpb-security-illustration {
    text-align: right;
    margin-top: 8px;
}
.cpb-security-shield { font-size: 40px; opacity: 0.15; }

.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel .flexible-form .flexible-cell {
  width: 100% !important;
}

.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel .x-form-item {
  margin-bottom: 18px;
}

.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel .x-form-item-label {
  display: block;
  float: none;
  width: auto !important;
  margin: 0 0 6px 0;
  font-size: 12px;
  font-weight: 600;
  color: #5f6b7a;
}

.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel .x-form-element,
.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel .x-form-field-wrap,
.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel input.x-form-field,
.ls-ai-compliance-admin.slide-admin-panel .ls-fieldset-panel textarea.x-form-textarea {
  width: 100% !important;
  box-sizing: border-box !important;
}
.ls-ai-compliance-admin.slide-admin-panel #cpb-section2-wrapper {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 12px !important;
}
.ls-ai-compliance-admin.slide-admin-panel #cpb-section2-wrapper .cpb-two-col-item {
    width: 100% !important;
}

.ls-filetab-item.ls-ai-compliance-admin {
	padding-top: 20px !important;
}

/* ── Badges statut — ComplianceAdminFileTab ─────────────────────────────
    .cpb-status-badge dans votre CSS existant
   ──────────────────────────────────────────────────────────────────────── */

.cpb-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 500;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
    line-height: 1;
}

/* ✓ Normalisé — vert */
.cpb-status-done {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}
.cpb-status-done::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #22c55e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/9px no-repeat;
    flex-shrink: 0;
}

/* ⏳ En cours — orange */
.cpb-status-inprogress {
    background: #fff7ed;
    color: #c2410c;
    border: 1px solid #fed7aa;
}

.cpb-status-abort {
    color: #c2410c;
    border: 1px solid #fed7aa;
}

/* ✗ Échec — rouge */
.cpb-status-failed {
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

/* — Non analysé — gris */
.cpb-status-none {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

/* === FULLPAGE OVERLAY === */
.pcw-panel.pcw-fullpage {
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    background: #fff;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* === HEADER === */
.pcw-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 24px;
    background: #1a2340;
    color: #fff;
    flex-shrink: 0;
}
.pcw-header-left { display: flex; flex-direction: column; gap: 4px; }
.pcw-back-btn { cursor: pointer; font-size: 13px; color: #aab; }
.pcw-back-btn:hover { color: #fff; }

/* === COMPTEURS === */
.pcw-counters { display: flex; gap: 16px; align-items: center; }

.pcw-counter-count { font-size: 22px; font-weight: 700; }
.pcw-counter-label { font-size: 11px; color: #ccd; }
.pcw-counter-total .pcw-counter-count { color: #fff; }
.pcw-counter-validated .pcw-counter-count { color: #4caf50; }
.pcw-counter-modified .pcw-counter-count { color: #ff9800; }
.pcw-counter-toprocess .pcw-counter-count { color: #90a4ae; }
.pcw-counter-rejected .pcw-counter-count { color: #f44336; }

/* === BOUTONS MODE === */
/*
.pcw-header-right { display: flex; gap: 8px; }
.pcw-mode-btn {
    padding: 7px 16px;
    border-radius: 6px;
    border: 1.5px solid rgba(255,255,255,0.3);
    cursor: pointer;
    font-size: 13px;
    color: #fff;
    background: transparent;
    transition: background 0.2s;
}*/
.pcw-mode-btn:hover { background: rgba(255,255,255,0.1); }
.pcw-mode-btn-active {
    background: rgba(255,255,255,0.2);
    border-color: #fff;
    font-weight: 600;
}

/* === BODY === */
.pcw-body { flex: 1; overflow: hidden; display: flex; }

/* === FOOTER === */
.pcw-footer { flex-shrink: 0; }


/* ============================================================
   PLAYBOOK CLAUSES WINDOW — CSS complet
   Étapes 1 + 2
   ============================================================ */

/* === FULLPAGE PANEL === */
.pcw-panel.pcw-fullpage {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #fff;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transition: opacity 0.3s ease;
    overflow: hidden;
}

/* ============================================================
   HEADER
   ============================================================ */
 /*  
.pcw-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 24px;
    background: #1a2340;
    color: #fff;
    flex-shrink: 0;
    gap: 16px;
    min-height: 60px;
}*/


.pcw-header-left {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 200px;
}

.pcw-back-btn {
    cursor: pointer;
    font-size: 12px;
    color: #9aa3c2;
    text-decoration: none;
    transition: color 0.15s;
}

.pcw-back-btn:hover {
    color: #fff;
}

.pcw-back-arrow {
    margin-right: 4px;
}

.pcw-header-title {
    color: black;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 15px;
}

/* === COMPTEURS === */
/*
.pcw-counters {
    display: flex;
    gap: 8px;
    align-items: center;
    flex: 1;
    justify-content: center;
}*/
/*
.pcw-counter {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 18px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    min-width: 90px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}
*/

.pcw-counter-count {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
}

.pcw-counter-label {
    font-size: 11px;
    color: #9aa3c2;
    margin-top: 2px;
    white-space: nowrap;
}

.pcw-counter-total .pcw-counter-count    { color: #fff; }
.pcw-counter-validated .pcw-counter-count { color: #4caf50; }
.pcw-counter-modified .pcw-counter-count  { color: #ff9800; }
.pcw-counter-added .pcw-counter-count  { color: #ff9800; }
.pcw-counter-toprocess .pcw-counter-count { color: #90a4ae; }
.pcw-counter-rejected .pcw-counter-count  { color: #f44336; }

/* === BOUTONS MODE === */
/*
.pcw-header-right {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}
*/
/*
.pcw-mode-btn {
    padding: 7px 16px;
    border-radius: 6px;
    border: 1.5px solid rgba(255, 255, 255, 0.3);
    cursor: pointer;
    font-size: 13px;
    color: #fff;
    background: transparent;
    transition: background 0.2s, border-color 0.2s;
    white-space: nowrap;
    user-select: none;
}
*/

.pcw-mode-btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

.pcw-mode-btn-active {
    background: rgba(255, 255, 255, 0.18);
    border-color: #fff;
    font-weight: 600;
}

/* ============================================================
   BODY
   ============================================================ */
.pcw-body {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* ============================================================
   FOOTER
   ============================================================ */
.pcw-footer {
    flex-shrink: 0;
    border-top: 1px solid #e0e0e0;
}

/* ============================================================
   ZONES DE STATUT (IN_PROGRESS / FAILED)
   ============================================================ */
.pcw-status-zone {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 40px;
}

.pcw-status-message {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: #555;
    text-align: center;
    max-width: 500px;
}

.pcw-status-error {
    background: #fff5f5;
    border: 1px solid #ffcdd2;
    border-left: 4px solid #f44336;
    border-radius: 6px;
    padding: 16px 24px;
    color: #c62828;
}

/* Spinner */
.pcw-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid #e0e0e0;
    border-top-color: #2e3862;
    border-radius: 50%;
    animation: pcw-spin 0.8s linear infinite;
}

@keyframes pcw-spin {
    to { transform: rotate(360deg); }
}

/* ============================================================
   LIST VIEW
   ============================================================ */
.pcw-list-view {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    min-height: 0;
}

/* === BARRE DE FILTRES === */
.pcw-filters-bar {
    display: flex;
    /*align-items: center;*/
    align-items: flex-end; /* aligne le bas des champs, label au-dessus */
    gap: 10px;
    padding: 10px 20px;
    background: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.pcw-filter-group {
  display: flex;
  flex-direction: column;
  min-width: 0; /* empêche le label d'élargir le groupe dans le flex-row parent */
  gap: 4px;
}

.pcw-filter-label {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%; /* borné à la largeur du groupe, jamais plus */
}

.pcw-filter-group .pcw-filter-search,
.pcw-filter-group select,
.pcw-filter-group input {
  width: 100%;
  box-sizing: border-box;
}

/* largeur fixe par type de champ : le label est ainsi mécaniquement
   borné à la même largeur que le champ, garanti quel que soit le texte */
.pcw-fg-search { width: 220px; }
.pcw-fg-select { width: 180px; }
.pcw-fg-number { width: 140px; }

.pcw-filter-search {
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    width: 220px;
    outline: none;
    transition: border-color 0.15s;
}

.pcw-filter-search:focus {
    border-color: #2e3862;
}

.pcw-filter-select {
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    background: #fff;
    cursor: pointer;
    outline: none;
    transition: border-color 0.15s;
}

.pcw-verif-edit-select.pcw-filter-select {
	width: auto !important;
}

.pcw-filter-select:focus {
    border-color: #2e3862;
}

.pcw-filter-reset {
    cursor: pointer;
    font-size: 13px;
    color: #888;
    padding: 6px 10px;
    border-radius: 6px;
    transition: color 0.15s, background 0.15s;
    user-select: none;
}

.pcw-filter-reset:hover {
    color: #333;
    background: #ececec;
}

/* === TABLEAU === */
.pcw-list-table {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* === LIGNE HEADER === */
.pcw-list-header-row {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    background: #f1f3f5;
    border-bottom: 2px solid #dee2e6;
    font-size: 11px;
    font-weight: 700;
    color: #777;
    letter-spacing: 0.5px;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 1;
}

/* === COLONNES === */
.pcw-list-col {
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    box-sizing: border-box;
}

.pcw-col-num {
    width: 48px;
    flex-shrink: 0;
    justify-content: center;
    /*color: #aaa;*/
    font-size: 12px;
}

.pcw-col-rule {
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.pcw-col-cat {
    width: 180px;
    flex-shrink: 0;
}

.pcw-col-sev {
    width: 120px;
    flex-shrink: 0;
}

.pcw-col-status {
    width: 120px;
    flex-shrink: 0;
}

.pcw-col-actions {
    width: 80px;
    flex-shrink: 0;
    gap: 8px;
    justify-content: center;
}

/* === LIGNE DE GROUPE === */
.pcw-list-group-row > div {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    background: #f0f2f7;
    border-bottom: 1px solid #e2e5ee;
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
    color: #2e3862;
    gap: 10px;
    user-select: none;
    transition: background 0.15s;
}

.pcw-group-right {
	display: flex;
	gap: 6px;
}

.pcw-list-group-row:hover {
    background: #e8ecf5;
}

.pcw-group-arrow {
	margin-right: 6px;
    font-size: 10px;
    color: #888;
    width: 14px;
    flex-shrink: 0;
}

.pcw-group-name {
    flex: 1;
}

.pcw-group-counters {
    display: flex;
    gap: 14px;
    font-size: 12px;
    font-weight: 400;
}

.pcw-gc-validated { color: #4caf50; }
.pcw-gc-modified  { color: #ff9800; }
.pcw-gc-toprocess { color: #90a4ae; }
.pcw-gc-rejected  { color: #f44336; }

/* === LIGNE DE CLAUSE === */
.pcw-list-clause-row {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 13px;
    background: #fff;
    transition: background 0.15s;
    min-height: 52px;
}

.pcw-list-clause-row:hover {
    background: #fafbff;
    cursor: pointer;
}

.pcw-rule-title {
    font-weight: 500;
    color: #1a2340;
    margin-bottom: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.pcw-rule-desc {
    font-size: 12px;
    color: #999;
    /*white-space: nowrap;*/
    /*overflow: hidden;*/
    /*text-overflow: ellipsis;*/
    max-width: 100%;
    /* pour afficher tout avec retour à la ligne*/
    white-space: normal;
    overflow-wrap: break-word;
}

/* === BADGES SÉVÉRITÉ === */
.pcw-sev-badge {
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}
/* badge statut de la règle */
.pcw-rule-status {
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}

.pcw-sev-blocking   { background: #fdecea; color: #c62828; }
.pcw-sev-important  { background: #fff3e0; color: #e65100; }
.pcw-sev-recommended { background: #e8f5e9; color: #2e7d32; }

/* === BADGES STATUT === */
.pcw-status-badge {
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}

/* === BADGES ORIGIN IA/USER === */
.pcw-origin-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    position: relative;
}
.pcw-origin-badge.pcw-verif-clause-origin-ai {
   /*  width: 18px;
    height: 18px;*/
    margin-left: 8px; 
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23F59E0B'%3E%3Cpath d='M12 2l1.6 4.4L18 8l-4.4 1.6L12 14l-1.6-4.4L6 8l4.4-1.6z'/%3E%3Cpath d='M19 13l.8 2.2L22 16l-2.2.8L19 19l-.8-2.2L16 16l2.2-.8z'/%3E%3Cpath d='M5 14l1 2.7L8.7 18 6 19l-1 2.7L4 19l-2.7-1L4 16.7z'/%3E%3C/g%3E%3C/svg%3E");
}

.pcw-origin-badge.pcw-verif-clause-origin-user {
    margin-left: 8px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236c5ce7' d='M12 12a4 4 0 1 0-4-4a4 4 0 0 0 4 4zm0 2c-4.42 0-8 2-8 4.5V20h16v-1.5C20 16 16.42 14 12 14z'/%3E%3C/svg%3E");
}

.pcw-origin-badge.pcw-verif-clause-origin-mixed {
    margin-left: 8px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='7' cy='10' r='3' fill='%236c5ce7'/%3E%3Cpath d='M2 20c0-2.5 2.5-4 5-4s5 1.5 5 4v1H2z' fill='%236c5ce7'/%3E%3Cg fill='%23F59E0B'%3E%3Cpath d='M17 4l1 3 3 1-3 1-1 3-1-3-3-1 3-1z'/%3E%3C/g%3E%3Cpath d='M17 14l.6 1.8L19 16l-1.4.2L17 18l-.6-1.8L15 16l1.4-.2z' fill='%23F59E0B'/%3E%3C/svg%3E");
	
}

.pcw-status-approved  { background: #e8f5e9; color: #2e7d32; }
.pcw-status-modified   { background: #fff3e0; color: #e65100; }
.pcw-status-to_review { background: #fffbeb; color: #757575; }
.pcw-status-rejected   { background: #fdecea; color: #c62828; }

/* === ACTIONS === */
.pcw-action-btn {
    cursor: pointer;
    font-size: 16px;
    opacity: 0.5;
    transition: opacity 0.15s;
    padding: 2px 4px;
    border-radius: 4px;
}

.pcw-action-btn:hover {
    opacity: 1;
    background: #f0f0f0;
}

/* === EMPTY === */
.pcw-list-empty {
    padding: 60px 40px;
    text-align: center;
    color: #bbb;
    font-size: 14px;
}

/* ============================================================
   BOUTON RÉEXTRACTION (héritage)
   ============================================================ */
.pcw-btn {
    display: inline-block;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: background 0.2s, color 0.2s;
    user-select: none;
}

.pcw-btn-close {
    background: #2e3862;
    color: #fff;
    border: none;
}

.pcw-btn-close:hover {
    background: #1a2340;
}


.cpb-section-title {
    font-size: 15px;
    font-weight: 600;
    color: #1a1a2e;
    margin-top: 16px;
    margin-bottom: 4px;
}

.cpb-section-sub {
    font-size: 13px;
    color: #666;
    margin-bottom: 12px;
}

/* Masque uniquement le label "Document source" natif 
   (le titre de section injecté le remplace) */
.ls-ai-compliance-admin #cpb-injected-documents + .x-form-item > label {
    display: none !important;
}

/* Zone drag & drop pleine largeur */
.ls-ai-compliance-admin .file-dropzone-box {
    width: 100% !important;
    border: 2px dashed #c5cae9 !important;
    border-radius: 8px !important;
    background: #fafbff !important;
    box-sizing: border-box;
}

/* Conteneur principal du champ documents pleine largeur */
.ls-ai-compliance-admin .ls-multiple-documents-container {
    width: 100% !important;
}

/* x-form-element pleine largeur */
.ls-ai-compliance-admin #cpb-injected-documents + .x-form-item .x-form-element {
    width: 100% !important;
}

/* Supprime la marge du x-form-item documents */
.ls-ai-compliance-admin #cpb-injected-documents + .x-form-item {
    padding-left: 0 !important;
}

.cpb-info-panel {
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    padding: 16px !important;
    margin-top: 16px !important;
    background: #ffffff !important;
}

.cpb-info-panel .ls-fieldset-panel-header {
    border-bottom: none !important;
}



/* Remonte les boutons Google/Gmail dans la zone tiretée */
.ls-ai-compliance-admin .ls-multiple-documents-container-bottom-space {
    display: flex;
    flex-direction: column;
}

.ls-ai-compliance-admin .file-dropzone-box {
    order: 1;
    flex: 1;
}

/* Boutons Google à l'intérieur de la zone */
.ls-ai-compliance-admin #cpb-injected-documents + .x-form-item 
    .ls-multiple-documents-container > div:last-child {
    order: 2;
    border: 2px dashed #c5cae9;
    border-top: none !important;
    border-radius: 0 0 8px 8px;
    padding: 8px;
    background: #fafbff;
    margin-top: -2px;
}


.cpb-paste-toggle-btn {
    background: #fff;
    border: 1px solid #c5cae9;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 13px;
    cursor: pointer;
    color: #3949ab;
}
.cpb-paste-toggle-btn:hover { background: #f5f5ff; }

.cpb-paste-area {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #c5cae9;
    border-radius: 6px;
    padding: 8px;
    font-size: 13px;
    resize: vertical;
    font-family: inherit;
}

.cpb-paste-warning {
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-radius: 4px;
    padding: 6px 10px;
    font-size: 12px;
    color: #795548;
    margin-bottom: 8px;
}

.cpb-btn {
    padding: 7px 16px;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    border: none;
}
.cpb-btn-primary  { background: #3949ab; color: #fff; }
.cpb-btn-primary:hover { background: #283593; }
.cpb-btn-secondary { background: #fff; color: #444; border: 1px solid #ccc; }
.cpb-btn-secondary:hover { background: #f5f5f5; }


/* Conteneur principal — flex column */
.ls-ai-compliance-admin .ls-multiple-documents-container {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    height: 200px !important
}

.ls-ai-compliance-admin  .ls-multiple-ref-entry-upload {
	margin: 2px 2px 10px 0px !important;
}

/* La dropzone passe en premier */
.ls-ai-compliance-admin .file-dropzone-box {
    order: 1 !important;
    width: 100% !important;
    min-height: 120px;
    border: 2px dashed #c5cae9 !important;
    border-radius: 8px !important;
    background: #fafbff !important;
    box-sizing: border-box;
}

/* Boutons Google en second */
.ls-ai-compliance-admin .ls-multiple-documents-container > div:nth-child(2) {
    order: 2 !important;
    margin-top: 8px !important;
    justify-content: flex-start !important;
    gap: 12px;
}

/* Cache la listview vide */
.ls-ai-compliance-admin .ls-multiple-referential-selected-values-upload:empty {
    display: none !important;
}

/* Force la dropzone en colonne centrée */
.ls-ai-compliance-admin .file-dropzone-box {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    /*min-height: 150px !important;*/
    padding: 24px 16px !important;
}

/* Les enfants directs de la dropzone en colonne */
.ls-ai-compliance-admin .file-dropzone-box > * {
    width: 100% !important;
}

/* Le wrapper GWT interne (div vide + bouton + texte) aussi en colonne */
/*
.ls-ai-compliance-admin .file-dropzone-box > div {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
}
*/

.cpb-ocr-spinner-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    font-size: 13px;
    color: #5c6bc0;
}

.cpb-spinner {
    width: 18px;
    height: 18px;
    border: 2px solid #c5cae9;
    border-top-color: #5c6bc0;
    border-radius: 50%;
    animation: cpb-spin 0.8s linear infinite;
}

/* En mode lecture, cache la section import complète */
.ls-ai-compliance-admin .x-form-field-wrap.ls-form-documents {
    display: none !important;
}

.ls-ai-compliance-admin #cpb-injected-documents {
    display: none !important;
}

@keyframes cpb-spin {
    to { transform: rotate(360deg); }
}


/* liste play
/* ── Fix alignement header vs lignes ── */

/* Dans les lignes de clause, le gwt-HTML est un wrapper intermédiaire
   — on le force à prendre la même taille que son enfant pcw-list-col */
.pcw-list-clause-row > .gwt-HTML {
    display: contents;
}

/* Le gwt-HTML dans la colonne actions contient plusieurs boutons
   — exception : ne pas appliquer display:contents sur actions */
.pcw-list-clause-row > .pcw-col-actions {
    display: flex;
}


/* ════════════════════════════════════════
   MODE VÉRIFICATION
════════════════════════════════════════ */
.pcw-verif-container {
    display: flex;
    flex: 1;
    height: 100%;
    overflow: hidden;
}

/* ── Colonnes ── */
.pcw-verif-left {
    flex: 0 0 35%;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #e5e7eb;
    overflow: hidden;
}

.pcw-verif-center {
    flex: 0 0 40%;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #e5e7eb;
    overflow-y: auto;
    padding: 20px;
    gap: 16px;
}

.pcw-verif-right {
    flex: 0 0 23%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 0;
}

/* ── Col header ── */
.pcw-verif-col-header {
    padding: 10px 16px;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
    background: #f9fafb;
}
.pcw-verif-col-title {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

/* ── Colonne gauche ── */
.pcw-verif-left-scroll {
    flex: 1;
    overflow-y: auto !important;
    height: 100%;
}
.pcw-verif-content { padding: 16px; font-size: 13px; line-height: 1.6; }
.pcw-evidence-highlight {
    background: #fef08a;
    border-radius: 3px;
    padding: 1px 2px;
}

/* ── Colonne centrale ── */
.pcw-verif-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    justify-content: center;
    /*border-bottom: 1px solid #e5e7eb;*/
}
.pcw-verif-nav-label { font-size: 12px; color: #9ca3af; }
.pcw-verif-nav-btn {
    background: none;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
    padding: 2px 8px;
    font-size: 16px;
    color: #374151;
}
.pcw-verif-nav-btn:disabled { opacity: 0.3; cursor: default; }
.pcw-verif-nav-counter { font-size: 13px; color: #374151; font-weight: 500; }

.pcw-verif-rule-header {
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.pcw-verif-rule-title {
	flex: 1;
    font-size: 16px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 700;
    color: #1e293b;  
}

.pcw-verif-clause-origin,
.pcw-status-badge {
    flex-shrink: 0;
    white-space: nowrap;
}

/* Status badges */
.pcw-status-badge {
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
}
.pcw-status-validated  { background: #dcfce7; color: #16a34a; }
.pcw-status-modified   { background: #fef3c7; color: #d97706; }
.pcw-status-to_process { background: #f3f4f6; color: #6b7280; }
.pcw-status-rejected   { background: #fee2e2; color: #dc2626; }

.pcw-verif-meta { display: flex; flex-direction: column; gap: 10px; }
.pcw-verif-meta-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
}
.pcw-verif-meta-icon { color: #9ca3af; flex-shrink: 0; margin-top: 1px; }
.pcw-verif-meta-label { color: #6b7280; min-width: 80px; flex-shrink: 0; }
.pcw-verif-meta-value { color: #1e293b; flex: 1; }

.pcw-verif-section-title {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
    margin-top: 4px;
}

.pcw-verif-evidence {
    background: #f8f9fb;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 12px;
}
.pcw-verif-evidence-text {
    font-size: 12px;
    color: #374151;
    white-space: pre-wrap;
    margin: 0 0 10px 0;
    font-family: inherit;
    background: #f0f4ff;
    border-radius: 4px;
    padding: 8px;
    border-left: 3px solid #4338ca;
}
.pcw-verif-see-doc-btn {
    background: none;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
    color: #374151;
}
.pcw-verif-see-doc-btn:hover { background: #f3f4f6; }

.pcw-verif-comment-zone { display: flex; flex-direction: column; gap: 4px; }
.pcw-verif-comment-area {
    width: 100%;
    height: 80px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 8px;
    font-size: 13px;
    resize: vertical;
    box-sizing: border-box;
}

/* ── Boutons actions ── */
.pcw-verif-actions {
    display: flex;
    gap: 10px;
    /*padding-top: 8px;*/
    /*border-bottom: 1px solid #e5e7eb;*/
    /*margin-top: 8px;*/
    padding-bottom: 8px;
    align-items: center;
    justify-content: center;
}
.pcw-verif-btn {
    flex: 1;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid #d1d5db;
    background: #fff;
    color: #374151;
    transition: all 0.15s;
}
.pcw-verif-btn-validate:hover,
.pcw-verif-btn-validate.pcw-verif-btn-active {
    background: #dcfce7; border-color: #16a34a; color: #16a34a;
}
.pcw-verif-btn-modify:hover,
.pcw-verif-btn-modify.pcw-verif-btn-active {
    background: #fef3c7; border-color: #d97706; color: #d97706;
}
.pcw-verif-btn-reject:hover,
.pcw-verif-btn-reject.pcw-verif-btn-active {
    background: #fee2e2; border-color: #dc2626; color: #dc2626;
}

/* ── Colonne droite ── */
.pcw-verif-right-scroll {
    flex: 1;
    overflow-y: auto !important;
    height: 100%;
}
.pcw-verif-right-list { padding: 8px 0; }

.pcw-verif-right-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px 4px;
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}
.pcw-verif-right-group-progress { font-size: 11px; color: #16a34a; }

.pcw-verif-right-row {
    padding: 8px 16px;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
}
.pcw-verif-right-row:hover { background: #f8f9fb; }
.pcw-verif-right-row-selected { background: #eef2ff !important; }

.pcw-verif-right-row-inner {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.pcw-verif-right-status-icon { flex-shrink: 0; margin-top: 1px; font-size: 12px; }
.pcw-verif-right-title { font-size: 12px; color: #374151; line-height: 1.4; }

.pcw-rule-badge
 {
    justify-content: center;
    white-space: nowrap;
    padding: 6px;
    border-radius: 50%;
    background-color: #dbeafe; 
    font-size: 12px;
    font-weight: bold;
}

.pcw-icon-approved { color: #16a34a; }
.pcw-icon-modified  { color: #d97706; }
.pcw-icon-to_process { color: #9ca3af; }
.pcw-icon-rejected  { color: #dc2626; }

.pcw-verif-no-selection,
.pcw-verif-no-content {
    padding: 40px;
    text-align: center;
    color: #9ca3af;
    font-size: 14px;
}

/* ── Champs édition mode vérification ── */
.pcw-verif-edit-input,
.pcw-verif-edit-area,
.pcw-verif-edit-select {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 6px 10px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-family: inherit !important;
    color: #1e293b !important;
    background: #fff !important;
    outline: none !important;
    transition: border-color 0.15s !important;
    /* Supprime le style GWT par défaut */
    -webkit-appearance: none !important;
    appearance: none !important;
}

.pcw-verif-edit-input:focus,
.pcw-verif-edit-area:focus,
.pcw-verif-edit-select:focus {
    border-color: #4338ca !important;
    box-shadow: 0 0 0 2px rgba(67, 56, 202, 0.1) !important;
}

.pcw-verif-edit-area {
    height: 70px !important;
    resize: vertical !important;
    line-height: 1.5 !important;
}

.pcw-verif-edit-select {
    cursor: pointer !important;
    cursor: pointer !important;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    padding-right: 32px !important;

    background: url(/gxt/themes/legalsuite/images/legalsuite/form/arrow_down_grey.png)
                no-repeat right 10px center !important;
    background-size: 16px 16px !important; 
}

.pcw-verif-edit-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    margin-bottom: 8px !important;
}

.pcw-verif-edit-row input {
	border: 1px solid var(--input-default-border-color);
	padding: 6px 10px;
	border-radius: 4px;
}
/*todo focus*/
.pcw-verif-edit-row input:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

.pcw-verif-edit-label {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    margin-left: 10px;
}

.pcw-verif-edit-form {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 12px 0 0 0;
    border-top: 1px solid #e5e7eb !important;
    /*border-bottom: 1px solid #e5e7eb !important;*/
   /* margin-bottom: 12px !important;*/
}

/* Supprime le style GWT qui ajoute des bordures bleues natives */
.pcw-verif-edit-input.gwt-TextBox,
.pcw-verif-edit-area.gwt-TextArea {
    border: 1px solid #d1d5db !important;
    padding: 6px 10px !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ── Preview panel ── */
.cpb-preview-panel {
    padding: 20px 16px;
    border-left: 1px solid #e5e7eb;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    background: #fff;
}

.cpb-preview-title {
    font-size: 15px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 2px;
}

.cpb-preview-sub {
    font-size: 12px;
    color: #9ca3af;
    margin-bottom: 8px;
}

.cpb-preview-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f1f3f5;
}

.cpb-preview-item-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cpb-preview-item-icon {
    font-size: 16px;
    color: #6b7280;
}

.cpb-preview-item-label {
    font-size: 13px;
    color: #374151;
}

.cpb-preview-item-value {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
}

.cpb-preview-item-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid #e5e7eb;
    border-top-color: #4338ca;
    border-radius: 50%;
    animation: cpb-spin 0.8s linear infinite;
}

@keyframes cpb-spin { to { transform: rotate(360deg); } }

.cpb-preview-open-btn {
    margin-top: 8px;
    padding: 10px 16px;
    background: #4338ca;
    color: #fff;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-align: center;
    transition: background 0.15s;
}
.cpb-preview-open-btn:hover { background: #3730a3; }
/*
.cpb-preview-security {
    display: flex;
    gap: 10px;
    padding: 12px;
    background: #f8f9fb;
    border-radius: 6px;
    margin-top: 8px;
}
*/
.cpb-preview-security-icon { font-size: 18px; flex-shrink: 0; }
.cpb-preview-security-title {
    font-size: 13px;
    font-weight: 600;
    color: #4338ca;
    margin-bottom: 4px;
}

.cpb-preview-security-container {
	display: flex;
	justify-content: space-between;
    gap: 20px;
    padding: 12px;
    background: #f8f9fb;
    border: 1px solid #e0dfff;
    border-radius: 6px;
    margin-top: 8px;
}

.cpb-security-block {
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-align: center;
}


/* barre verticale */
.cpb-divider {
    width: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: #e0dfff;
}


/* Texte avec retour à la ligne */
.cpb-preview-title,
.cpb-preview-sub,
.cpb-preview-item-label,
.cpb-preview-security-title,
.cpb-preview-security-text {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    text-align: center;
}

/* Item : label prend tout l'espace, valeur fixe à droite */
.cpb-preview-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #f1f3f5 !important;
    gap: 8px !important;
}

.cpb-preview-item-left {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.cpb-preview-item-label {
    flex: 1 !important;
    min-width: 0 !important;
    font-size: 13px !important;
    color: #374151 !important;
}

.cpb-preview-item-value {
    flex-shrink: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
}

/* Sécurité */
.cpb-preview-security {
    display: flex !important;
    gap: 8px !important;
    padding: 12px !important;
    background: #f8f9fb !important;
    border-radius: 6px !important;
    margin-top: 8px !important;
    align-items: flex-start !important;
}

.cpb-preview-security > div {
    flex: 1 !important;
    min-width: 0 !important;
}

/* header */
.pcw-header {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    background: #ffffff;
    border-bottom: 1px solid #e6eaf0;
    min-height: 90px;
}

.pcw-header-left {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ==========================================================
   BACK BUTTON
   ========================================================== */

.pcw-back-btn {
	padding: 6px 10px;
	border-radius: 4px;
	color: white;
    background-color: #304287;
    width: fit-content;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all .2s ease;
}

.pcw-back-btn:hover {
    /*color: #304287;*/
}

.pcw-back-arrow {
    margin-right: 6px;
}

/* ==========================================================
   KPI COUNTERS
   ========================================================== */

.pcw-counters {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: flex-start;
}

.pcw-total-counters,
.pcw-check-counters {
	display: flex;
	gap: 5px;
}


/* wrapper GWT */
.pcw-total-counters > .gwt-HTML,
.pcw-check-counters > .gwt-HTML {
  flex: 1;
}

.pcw-counter {

    padding: 12px 18px;

    border-radius: 12px;

    border: 1px solid #e5e7eb;

    background: #ffffff;

    text-align: center;

    transition: all .2s ease;
}

.pcw-counter:hover {
    transform: translateY(-2px);

    box-shadow: 0 4px 12px rgba(0,0,0,.08);
}

.pcw-counter-count {
    display: block;

    font-size: 24px;
    font-weight: 700;

    margin-bottom: 4px;
}

.pcw-counter-label {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ==========================================================
   DETECTED
   ========================================================== */

.pcw-counter-total {
    background: #f4f8ff;
    border-color: #dbeafe;
}

.pcw-counter-total .pcw-counter-count {
    color: #304287;
}

/* ==========================================================
   VALIDATED
   ========================================================== */

.pcw-counter-validated {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.pcw-counter-validated .pcw-counter-count {
    color: #16a34a;
}

/* ==========================================================
   MODIFIED
   ========================================================== */

.pcw-counter-modified {
    background: #f5f3ff;
    border-color: #ddd6fe;
}

.pcw-counter-modified .pcw-counter-count {
    color: #7c3aed;
}

/* ==========================================================
   TO PROCESS
   ========================================================== */

.pcw-counter-toprocess {
    background: #fffbeb;
    border-color: #fde68a;
}

.pcw-counter-toprocess .pcw-counter-count {
    color: #f59e0b;
}

/* ==========================================================
   REJECTED
   ========================================================== */

.pcw-counter-rejected {
    background: #fef2f2;
    border-color: #fecaca;
}

.pcw-counter-rejected .pcw-counter-count {
    color: #ef4444;
}

/* ==========================================================
   RIGHT AREA
   ========================================================== */

.pcw-header-right {
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}

/* ==========================================================
   MODE BUTTONS
   ========================================================== */

.pcw-mode-btn {
    display: block;
    align-items: center;
    min-width: 100px;
    max-width: 150px;
    padding: 6px 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; 
    text-align: start;
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    border-radius: 10px;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all .2s ease;
}

.pcw-mode-btn:hover {
    background: #eef4ff;

    border-color: #304287;

    color: #304287;
}

.pcw-mode-btn-active {
    background: #304287;

    border-color: #304287;

    color: white;

    box-shadow: 0 3px 10px rgba(44, 90, 160, .25);
}

.pcw-mode-btn-active:hover {
    color: white;
    background: #24508f;
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 1400px) {

    .pcw-header {
        flex-wrap: wrap;
        gap: 16px;
    }

    .pcw-counters {
        order: 3;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }
}

@media (max-width: 900px) {

    .pcw-counter-count {
        font-size: 20px;
    }
    
    .ls-ai-compliance-admin .file-dropzone-box {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    column-gap: 24px !important;

    height: 105px !important;
    min-height: 105px !important;
    max-height: 105px !important;
    padding: 18px 24px !important;
}

.ls-ai-compliance-admin .file-dropzone-box > div:first-child {
    display: none !important;
}

.ls-ai-compliance-admin .file-dropzone-box > div:nth-child(2) {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    margin: 0 !important;
    text-align: center !important;
}

.ls-ai-compliance-admin .file-dropzone-box > div:nth-child(3) {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    margin: 0 !important;
    text-align: center !important;
}

.ls-ai-compliance-admin #cpb-paste-container {
    margin: 0 !important;
}

.ls-ai-compliance-admin #cpb-paste-btn,
.ls-ai-compliance-admin .upload-button-main button {
    height: 38px !important;
    min-width: 190px !important;
    border: 1px solid #4f35c9 !important;
    border-radius: 10px !important;
    background: white !important;
    color: #4f35c9 !important;
    font-weight: 700 !important;
}

}