/* ==========================================================================
   TrustHub - Evaluations Workspace Component
   Scoped under .th-eval-workspace to avoid conflicts
   ========================================================================== */

.th-eval-workspace {
  border: 1px solid var(--th-border, #e4eaf7);
  background: #fff;
  min-height: 870px;
  display: grid;
  grid-template-columns: 340px 1fr;
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(32, 36, 79, 0.06);
}

/* --- Left sidebar --- */
.th-eval-workspace .ew-left {
  background: #fafbff;
  border-right: 1px solid var(--th-border, #e4eaf7);
  padding: 22px 14px 24px;
  overflow-y: auto;
}

.th-eval-workspace .ew-progress-title {
  font-size: 18px;
  font-weight: 700;
  margin: 0;
  color: #20244f;
}

.th-eval-workspace .ew-progress-sub {
  margin-top: 6px;
  font-size: 13px;
  color: #4c5369;
  line-height: 1.4;
}

.th-eval-workspace .ew-progress-line {
  margin-top: 10px;
  height: 6px;
  border-radius: 999px;
  background: #e9edf6;
  overflow: hidden;
}

.th-eval-workspace .ew-progress-line > span {
  display: block;
  height: 100%;
  background: var(--th-primary, #3539f0);
  border-radius: 999px;
  transition: width 0.3s ease;
}

.th-eval-workspace .ew-progress-ratio {
  margin-top: 6px;
  font-size: 12px;
  color: #7a8092;
  text-align: right;
}

.th-eval-workspace .ew-list {
  margin-top: 16px;
  padding-left: 14px;
}

.th-eval-workspace .ew-eval-group {
  margin-bottom: 16px;
}

.th-eval-workspace .ew-eval-group-title {
  cursor: pointer;
  user-select: none;
}

.th-eval-workspace .ew-eval-group-title .ew-collapse-icon {
  transition: transform 0.2s ease;
  color: #99a2ba;
  margin-right: 4px;
  display: inline-block;
  vertical-align: -1px;
}

.th-eval-workspace .ew-eval-group-title .ew-collapse-icon svg {
  width: 11px;
  height: 11px;
  display: block;
}

.th-eval-workspace .ew-eval-group.ew-collapsed .ew-collapse-icon {
  transform: rotate(-90deg);
}

.th-eval-workspace .ew-eval-group.ew-collapsed .ew-eval-tasks {
  display: none;
}

.th-eval-workspace .ew-no-tasks-note {
  margin: 8px 0 4px 18px;
  font-size: 13px;
  color: #8a95b3;
  font-style: italic;
}

.th-eval-workspace .ew-eval-group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.66px;
  color: #5f6a8c;
  margin: 10px 0 0;
  font-weight: 700;
}

.th-eval-workspace .ew-eval-dates {
  font-size: 11px;
  color: #8f99b3;
  margin: 3px 0 6px;
  padding-left: 16px;
  font-variant-numeric: tabular-nums;
}

.th-eval-workspace .ew-eval-chip {
  font-size: 10px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid #d7deed;
  color: #4e5874;
  background: #fff;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
}

.th-eval-workspace .ew-eval-chip.ew-chip-active {
  border-color: #b8d4ff;
  background: #eef5ff;
  color: var(--th-primary, #3539f0);
}

.th-eval-workspace .ew-eval-chip.ew-chip-completed {
  border-color: #a8dfc6;
  background: #edf9f3;
  color: #2f7c57;
}

.th-eval-workspace .ew-eval-chip.ew-chip-success {
  border-color: #a8dfc6;
  background: #edf9f3;
  color: #2f7c57;
}

.th-eval-workspace .ew-eval-chip.ew-chip-info {
  border-color: #a3d5f7;
  background: #e8f4fd;
  color: #0277bd;
}

.th-eval-workspace .ew-eval-chip.ew-chip-warning {
  border-color: #f5d5a0;
  background: #fef8ec;
  color: #e65100;
}

.th-eval-workspace .ew-eval-chip.ew-chip-danger {
  border-color: #f2b9c3;
  background: #fef2f4;
  color: #c62828;
}

/* --- Cabecera resumen del sidebar (solo workspace de evaluaciones; People
   Compliance comparte .ew-left y no debe verse afectado, de ahí el modificador
   ew-left-with-summary que emite únicamente este runtime) --- */
.th-eval-workspace .ew-left.ew-left-with-summary {
  padding-top: 0;
}

.th-eval-workspace .ew-summary-wrap {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #fafbff;
  padding: 18px 0 8px;
  box-shadow: 0 10px 12px -12px rgba(32, 36, 79, 0.12);
}

.th-eval-workspace .ew-summary {
  background: #fff;
  border: 1px solid #e4eaf7;
  border-radius: 12px;
  padding: 14px 15px 13px;
  box-shadow: 0 1px 2px rgba(32, 36, 79, 0.05);
}

.th-eval-workspace .ew-summary-line {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.th-eval-workspace .ew-summary-n {
  font-size: 26px;
  font-weight: 700;
  color: #1d2350;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.th-eval-workspace .ew-summary-lbl {
  font-size: 12.5px;
  color: #4c5369;
  line-height: 1.35;
}

.th-eval-workspace .ew-summary-meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 7px;
  font-size: 11px;
  color: #7d879d;
  font-variant-numeric: tabular-nums;
}

.th-eval-workspace .ew-summary-done {
  border-color: #a8dfc6;
  background: #f4fbf7;
}

.th-eval-workspace .ew-summary-check {
  color: #1e7a4f;
  font-weight: 700;
  font-size: 16px;
}

.th-eval-workspace .ew-summary-title {
  font-size: 15px;
  font-weight: 700;
  color: #1e7a4f;
}

.th-eval-workspace .ew-summary-sub {
  font-size: 12px;
  color: #4c5369;
  margin-top: 3px;
}

.th-eval-workspace .ew-summary-done .ew-progress-line > span {
  background: #1ab06f;
}

/* --- Contador de pendientes por evaluación --- */
.th-eval-workspace .ew-eval-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.th-eval-workspace .ew-eval-badges {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.th-eval-workspace .ew-eval-count {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.th-eval-workspace .ew-eval-count.ew-count-pending {
  background: #fef8ec;
  border: 1px solid #f5d5a0;
  color: #b26500;
}

.th-eval-workspace .ew-eval-count.ew-count-done {
  background: #edf9f3;
  border: 1px solid #a8dfc6;
  color: #2f7c57;
}

.th-eval-workspace .ew-eval-count.ew-count-review {
  background: #eef5ff;
  border: 1px solid #b8d4ff;
  color: #3d6fd4;
}

/* --- Task items --- */
.th-eval-workspace .ew-task {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  gap: 9px;
  align-items: center;
  padding: 10px 9px;
  border-radius: 10px;
  margin: 6px 0;
  color: #4a5066;
  font-size: 14px;
  line-height: 1.25;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.15s ease;
}

.th-eval-workspace .ew-task:hover {
  background: #f3f6ff;
}

.th-eval-workspace .ew-task.ew-active {
  background: #fff;
  border: 1px solid #d9e2f8;
  color: var(--th-primary, #3539f0);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(32, 36, 79, 0.06);
}

.th-eval-workspace .ew-task.ew-done {
  color: #4a5066;
}

.th-eval-workspace .ew-task.ew-inactive-eval {
  opacity: 0.86;
}

.th-eval-workspace .ew-step {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid #c7ccdb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: #7a8092;
  background: #fff;
  flex-shrink: 0;
}

.th-eval-workspace .ew-task.ew-done .ew-step {
  border-color: #1ab06f;
  background: #1ab06f;
  color: #fff;
  font-weight: 700;
}

.th-eval-workspace .ew-step svg {
  width: 10px;
  height: 10px;
}

.th-eval-workspace .ew-task.ew-active .ew-step {
  border-color: var(--th-primary, #3539f0);
  border-width: 2px;
  color: var(--th-primary, #3539f0);
}

.th-eval-workspace .ew-task-name {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.th-eval-workspace .ew-task-kind {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.55px;
  color: #7d879d;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
}

.th-eval-workspace .ew-task-label {
  font-size: 14px;
}

.th-eval-workspace .ew-comment-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #ff6f4a;
  box-shadow: 0 0 0 2px #fff;
  flex-shrink: 0;
}

/* --- Task status indicator in sidebar --- */
.th-eval-workspace .ew-task-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

.th-eval-workspace .ew-task-status-dot.ew-dot-pending { background: #f0b429; box-shadow: 0 0 0 2.5px #fdf3d7; }
.th-eval-workspace .ew-task-status-dot.ew-dot-approved { background: #1ab06f; box-shadow: 0 0 0 2.5px #ddf3e8; }
.th-eval-workspace .ew-task-status-dot.ew-dot-rejected { background: #e34d5f; box-shadow: 0 0 0 2.5px #fae1e5; }
.th-eval-workspace .ew-task-status-dot.ew-dot-review {
  background: var(--th-primary, #3539f0);
  box-shadow: 0 0 0 2.5px rgba(53, 57, 240, 0.12);
  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--th-primary, #3539f0) 12%, #fff);
}
.th-eval-workspace .ew-task-status-dot.ew-dot-draft { background: #a0aec0; box-shadow: 0 0 0 2.5px #edf0f4; }
.th-eval-workspace .ew-task-status-dot.ew-dot-expired { background: #9ca3af; box-shadow: 0 0 0 2.5px #eceef1; }
.th-eval-workspace .ew-task-status-dot.ew-dot-not-started { background: #d1d5db; box-shadow: 0 0 0 2.5px #f1f3f5; }

/* --- Form mini progress in sidebar --- */
.th-eval-workspace .ew-task-mini-progress {
  height: 3px;
  border-radius: 999px;
  background: #e9edf6;
  margin-top: 3px;
  overflow: hidden;
}

.th-eval-workspace .ew-task-mini-progress > span {
  display: block;
  height: 100%;
  background: var(--th-primary, #3539f0);
  border-radius: 999px;
  transition: width 0.3s ease;
}

/* --- Expiration badge --- */
.th-eval-workspace .ew-eval-chip.ew-chip-expired {
  border-color: #f2b9c3;
  background: #fef2f4;
  color: #b73f58;
}

.th-eval-workspace .ew-expiration-banner {
  background: #fef2f4;
  border: 1px solid #f2b9c3;
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 13px;
  color: #b73f58;
  margin-bottom: 16px;
}

/* --- Result (evaluation outcome) --- */
.th-eval-workspace .ew-result-panel {
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.th-eval-workspace .ew-result-decision {
  display: flex;
  align-items: center;
  gap: 14px;
}
.th-eval-workspace .ew-result-badge {
  display: inline-block;
  padding: 8px 18px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 15px;
  background: #e8f5e9;
  color: #2e7d32;
}
.th-eval-workspace .ew-result-accepted .ew-result-badge { background: #e8f5e9; color: #2e7d32; }
.th-eval-workspace .ew-result-accepted_with_conditions .ew-result-badge { background: #e1f5fe; color: #0277bd; }
.th-eval-workspace .ew-result-partial_rejection .ew-result-badge { background: #fff3e0; color: #e65100; }
.th-eval-workspace .ew-result-rejected .ew-result-badge { background: #fce4ec; color: #c62828; }
.th-eval-workspace .ew-result-date {
  font-size: 13px;
  color: #8a95b3;
}
.th-eval-workspace .ew-result-comment {
  background: #f8faff;
  border: 1px solid #e2e8f5;
  border-radius: 12px;
  padding: 18px 22px;
}
.th-eval-workspace .ew-result-comment h4 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: #5a6a8a;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.th-eval-workspace .ew-result-comment p {
  margin: 0;
  font-size: 14px;
  color: #3d4a66;
  line-height: 1.6;
  white-space: pre-wrap;
}

/* --- Result: mensaje "todo enviado" (evaluación sin decisión) --- */
.th-eval-workspace .ew-result-all-sent {
  gap: 0;
}
.th-eval-workspace .ew-result-all-sent .ew-help-head {
  margin-bottom: 14px;
}
.th-eval-workspace .ew-all-sent-icon {
  color: #1e7a4f;
  background: #edf9f3;
}
.th-eval-workspace .ew-all-sent-icon svg {
  width: 22px;
  height: 22px;
}
.th-eval-workspace .ew-all-sent-body .ew-help-p {
  color: #3d4a66;
}

/* --- Document preview modal --- */
.th-eval-workspace .ew-preview-overlay {
  position: absolute;
  inset: 0;
  background: rgba(17, 20, 34, 0.7);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}

.th-eval-workspace .ew-preview-modal {
  background: #fff;
  border-radius: 14px;
  width: 90%;
  max-width: 900px;
  height: 80%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.th-eval-workspace .ew-preview-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  border-bottom: 1px solid #ebeff7;
}

.th-eval-workspace .ew-preview-header h4 {
  margin: 0;
  font-size: 16px;
  color: #1d276b;
}

.th-eval-workspace .ew-preview-close {
  background: none;
  border: 0;
  font-size: 22px;
  color: #6b7490;
  cursor: pointer;
}

.th-eval-workspace .ew-preview-body {
  flex: 1;
  overflow: hidden;
}

.th-eval-workspace .ew-preview-body iframe {
  width: 100%;
  height: 100%;
  border: none;
}

/* --- Unread comments indicator --- */
.th-eval-workspace .ew-comment-dot.ew-unread {
  animation: ew-pulse 1.5s infinite;
}

.th-eval-workspace .ew-btn-doc-action .ew-badge.ew-badge-unread {
  animation: ew-pulse 1.5s infinite;
}

@keyframes ew-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* --- Right panel --- */
.th-eval-workspace .ew-right {
  padding: 24px 26px;
  background: #fff;
  overflow-y: auto;
}

.th-eval-workspace .ew-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-bottom: 18px;
}

.th-eval-workspace .ew-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.th-eval-workspace .ew-meta-kicker {
  font-size: 12px;
  color: #8a94ad;
}

.th-eval-workspace .ew-meta-kicker strong {
  color: #3d4666;
  font-weight: 600;
}

.th-eval-workspace .ew-meta-kicker .ew-sep {
  color: #c3cadd;
  margin: 0 3px;
}

.th-eval-workspace .ew-meta-title {
  font-size: clamp(34px, 3.1vw, 52px);
  color: #202a70;
  font-weight: 600;
  line-height: 1.22;
}

.th-eval-workspace .ew-header-actions {
  display: flex;
  gap: 9px;
  align-items: center;
  flex-shrink: 0;
}

.th-eval-workspace .ew-pill {
  font-size: 12px;
  border-radius: 999px;
  padding: 6px 12px;
  border: 1px solid #d7dbe8;
  color: #29304e;
  background: #fff;
  cursor: default;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.th-eval-workspace .ew-pill .ew-pill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

.th-eval-workspace .ew-pill.ew-due {
  border-color: #f5d5a0;
  background: #fef8ec;
  color: #b26500;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.th-eval-workspace .ew-pill.ew-due svg {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
}

.th-eval-workspace .ew-pill.ew-state {
  border-color: #d9e8ff;
  background: #eef5ff;
  color: var(--th-primary, #3539f0);
  font-weight: 600;
}

.th-eval-workspace .ew-pill.ew-state-done {
  border-color: #a8dfc6;
  background: #edf9f3;
  color: #2f7c57;
}

.th-eval-workspace .ew-pill.ew-state-success {
  border-color: #a8dfc6;
  background: #edf9f3;
  color: #2f7c57;
}

.th-eval-workspace .ew-pill.ew-state-info {
  border-color: #a3d5f7;
  background: #e8f4fd;
  color: #0277bd;
}

.th-eval-workspace .ew-pill.ew-state-warning {
  border-color: #f5d5a0;
  background: #fef8ec;
  color: #e65100;
}

.th-eval-workspace .ew-pill.ew-state-danger {
  border-color: #f2b9c3;
  background: #fef2f4;
  color: #c62828;
}

.th-eval-workspace .ew-pill.ew-state-readonly {
  border-color: #dde0ea;
  background: #f4f5f9;
  color: #5e6478;
}

.th-eval-workspace .ew-pill.ew-comments {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}

.th-eval-workspace .ew-pill.ew-comments:hover {
  background: #f8f9ff;
}

.th-eval-workspace .ew-pill.ew-comments .ew-count {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ff6f4a;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

/* --- Form view progress bar --- */
.th-eval-workspace .ew-form-progress {
  margin-bottom: 16px;
}

.th-eval-workspace .ew-form-progress .ew-progress-line {
  margin-top: 0;
}

.th-eval-workspace .ew-form-progress-text {
  font-size: 12px;
  color: #6f7485;
  margin-top: 4px;
}

/* --- Form footer actions --- */
.th-eval-workspace .ew-form-footer {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--th-border, #e4eaf7);
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* --- Form text mode (read-only: render values as text, not inputs) --- */
.th-eval-workspace .ew-form-text-mode input[type="text"],
.th-eval-workspace .ew-form-text-mode input[type="email"],
.th-eval-workspace .ew-form-text-mode input[type="number"],
.th-eval-workspace .ew-form-text-mode input[type="tel"],
.th-eval-workspace .ew-form-text-mode input[type="url"],
.th-eval-workspace .ew-form-text-mode input[type="date"],
.th-eval-workspace .ew-form-text-mode input[type="datetime-local"],
.th-eval-workspace .ew-form-text-mode textarea,
.th-eval-workspace .ew-form-text-mode select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 6px 0;
  resize: none;
  color: #2a3044;
  font-weight: 500;
  opacity: 1;
  cursor: default;
  pointer-events: none;
  height: auto;
  min-height: unset;
}

.th-eval-workspace .ew-form-text-mode select {
  background-image: none;
  padding-right: 0;
}

.th-eval-workspace .ew-form-text-mode input[type="checkbox"],
.th-eval-workspace .ew-form-text-mode input[type="radio"] {
  pointer-events: none;
  opacity: 0.8;
}

.th-eval-workspace .ew-form-text-mode .form-control:disabled,
.th-eval-workspace .ew-form-text-mode .form-control[disabled],
.th-eval-workspace .ew-form-text-mode .form-select:disabled,
.th-eval-workspace .ew-form-text-mode .form-select[disabled] {
  background-color: transparent;
  border-color: transparent;
  opacity: 1;
  color: #2a3044;
}

.th-eval-workspace .ew-form-text-mode .select2-container {
  pointer-events: none;
}

.th-eval-workspace .ew-form-text-mode .select2-container .select2-selection {
  border: none;
  background: transparent;
  box-shadow: none;
  cursor: default;
}

.th-eval-workspace .ew-form-text-mode .select2-container .select2-selection__arrow {
  display: none;
}

.th-eval-workspace .ew-form-text-mode .dropzone {
  display: none;
}

.th-eval-workspace .ew-form-text-mode button[type="submit"],
.th-eval-workspace .ew-form-text-mode button[type="button"].btn-draft,
.th-eval-workspace .ew-form-text-mode .form-actions {
  display: none;
}

/* --- Documents table --- */
.th-eval-workspace .ew-task-title-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 22px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e8edf7;
}

.th-eval-workspace .ew-task-icon-pill {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  background: #eef1fe;
  background: color-mix(in srgb, var(--th-primary, #3539f0) 7%, #fff);
  display: flex;
  align-items: center;
  justify-content: center;
}

.th-eval-workspace .ew-task-icon-pill .th-icon {
  width: 22px;
  height: 22px;
}

.th-eval-workspace .ew-task-title {
  font-size: 18px;
  font-weight: 700;
  color: #1a2153;
  margin: 0;
  line-height: 1.3;
  letter-spacing: -0.1px;
}

.th-eval-workspace .ew-doc-table {
  margin-top: 8px;
}

.th-eval-workspace .ew-doc-row {
  display: grid;
  grid-template-columns: 1fr 200px 180px;
  align-items: center;
  padding: 14px 8px;
  border-top: 1px solid #e8edf7;
  font-size: 14px;
  color: #3d4666;
  transition: background 0.15s ease;
}

.th-eval-workspace .ew-doc-row:not(:first-child):hover {
  background: #fafbfe;
}

.th-eval-workspace .ew-doc-row:first-child {
  border-top: 0;
  border-bottom: 1px solid #e1e7f4;
  color: #8a94ad;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.77px;
  font-weight: 600;
  padding: 0 8px 10px;
  margin-bottom: 2px;
}

.th-eval-workspace .ew-doc-name {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
}

/* Status inside doc-name: visible only on mobile */
.th-eval-workspace .ew-doc-name .ew-doc-status {
  display: none;
}

.th-eval-workspace .ew-doc-name-title {
  font-size: 15px;
  font-weight: 600;
  color: #1d2350;
  line-height: 1.25;
}

.th-eval-workspace .ew-doc-status {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.th-eval-workspace .ew-doc-status-text {
  font-size: 13px;
  color: #5b6784;
  font-weight: 500;
}

.th-eval-workspace .ew-doc-extra-info {
  font-size: 12px;
  color: #8f99b3;
  margin-left: 10px;
  font-variant-numeric: tabular-nums;
}

.th-eval-workspace .ew-doc-version {
  font-size: 11px;
  color: #667292;
  background: #fff;
  border: 1px solid #e1e7f4;
  border-radius: 5px;
  padding: 1px 6px;
  margin-left: 8px;
  font-weight: 500;
  font-style: normal;
}

.th-eval-workspace .ew-doc-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.th-eval-workspace .ew-btn-doc-action {
  border-radius: 999px;
  width: 38px;
  height: 38px;
  font-size: 0;
  padding: 0;
  line-height: 1.2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #dfe5f2;
  color: #5b6784;
  background: #fff;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.th-eval-workspace .ew-btn-doc-action:hover {
  background: #f4f6fd;
  border-color: #c6cffb;
}

.th-eval-workspace .ew-btn-doc-action:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(53, 57, 240, 0.45);
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px color-mix(in srgb, var(--th-primary, #3539f0) 45%, #fff);
}

.th-eval-workspace .ew-btn-doc-action .th-icon {
  width: 19px;
  height: 19px;
  opacity: 1;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-upload {
  border-color: #dfe5f2;
  background: #fff;
  color: #5b6784;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-upload:hover {
  background: #f4f6fd;
  border-color: #c6cffb;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-pdf-pending {
  background: #fef8ec;
  border-color: #f5d5a0;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-pdf-approved {
  background: #e6f7ef;
  border-color: #bfe8d6;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-pdf-review {
  background: #eceffe;
  border-color: #ccd6ff;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-comments {
  position: relative;
}

.th-eval-workspace .ew-btn-doc-action .ew-badge {
  position: absolute;
  top: -3px;
  right: -3px;
  font-size: 9px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  line-height: 16px;
  padding: 0 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ff6f4a;
  color: #fff;
  font-weight: 700;
  box-shadow: 0 0 0 2px #fff;
}

/* --- Policy view --- */
.th-eval-workspace .ew-policy-document {
  border: 1px solid #dfe4f3;
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}

.th-eval-workspace .ew-policy-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid #ebeff7;
  background: #fafbff;
}

.th-eval-workspace .ew-policy-name {
  margin: 0;
  font-size: 22px;
  color: #1d276b;
  font-weight: 600;
  line-height: 1.2;
}

.th-eval-workspace .ew-policy-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  color: #69779c;
  font-size: 13px;
  font-style: italic;
}

.th-eval-workspace .ew-policy-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  border: 1px solid #e4c96f;
  background: #fff9e9;
  color: #8d7220;
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.th-eval-workspace .ew-policy-state.ew-approved {
  border-color: #a8dfc6;
  background: #edf9f3;
  color: #2f7c57;
}

.th-eval-workspace .ew-policy-body {
  padding: 18px;
  color: #2f3553;
  font-size: 14px;
  line-height: 1.56;
}

.th-eval-workspace .ew-policy-body h4 {
  margin: 0 0 8px;
  font-size: 17px;
  color: #1d276b;
  font-weight: 600;
}

.th-eval-workspace .ew-policy-body p {
  margin: 0 0 14px;
}

.th-eval-workspace .ew-policy-body ul {
  margin: 0 0 14px;
  padding-left: 18px;
}

.th-eval-workspace .ew-policy-body ul li {
  margin-bottom: 7px;
}

.th-eval-workspace .ew-policy-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 18px;
  border-top: 1px solid #ebeff7;
  background: #fff;
}

.th-eval-workspace .ew-policy-btn {
  height: 36px;
  border-radius: 0.5rem;
  padding: 0 14px;
  font-size: 0.875rem;
  font-weight: 600;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}

.th-eval-workspace .ew-policy-btn.ew-accept {
  background: var(--th-primary, #3539f0);
  color: #fff;
  border-color: var(--th-primary, #3539f0);
}

.th-eval-workspace .ew-policy-btn.ew-accept:hover {
  opacity: 0.9;
}

.th-eval-workspace .ew-policy-btn.ew-reject {
  background: #fff;
  border-color: #f2b9c3;
  color: #b73f58;
}

.th-eval-workspace .ew-policy-btn.ew-reject:hover {
  background: #fef2f4;
}

/* --- Backdrop & Drawer (comments) --- */
.th-eval-workspace .ew-backdrop {
  display: none;
  position: absolute;
  inset: 0;
  background: rgba(17, 20, 34, 0.54);
  z-index: 5;
}

.th-eval-workspace .ew-backdrop.ew-visible {
  display: block;
}

.th-eval-workspace .ew-drawer {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  width: 470px;
  height: 100%;
  background: #fff;
  z-index: 6;
  border-left: 1px solid #dde2ec;
  box-shadow: -8px 0 22px rgba(17, 20, 34, 0.13);
  flex-direction: column;
}

.th-eval-workspace .ew-drawer.ew-visible {
  display: flex;
}

.th-eval-workspace .ew-drawer-head {
  padding: 14px 16px;
  border-bottom: 1px solid #ebeff6;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.th-eval-workspace .ew-drawer-title {
  margin: 0;
  font-size: 19px;
  color: #1f2450;
  line-height: 1.32;
  max-width: 370px;
}

.th-eval-workspace .ew-drawer-close {
  background: none;
  border: 0;
  font-size: 22px;
  color: #6b7490;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
}

.th-eval-workspace .ew-thread {
  flex: 1;
  overflow: auto;
  padding: 14px 16px;
  background: #fcfdff;
}

.th-eval-workspace .ew-msg {
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}

.th-eval-workspace .ew-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  background: #7e5bff;
  flex-shrink: 0;
}

.th-eval-workspace .ew-bubble {
  border: 1px solid #e1e6f0;
  background: #fff;
  border-radius: 9px;
  padding: 9px 10px;
  width: 100%;
}

.th-eval-workspace .ew-bubble-meta {
  font-size: 11px;
  color: #72798e;
  margin-bottom: 4px;
}

.th-eval-workspace .ew-origin-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  vertical-align: middle;
}
.th-eval-workspace .ew-origin-admin {
  background: #e8f4fd;
  color: #1a73e8;
}
.th-eval-workspace .ew-origin-portal {
  background: #e6f7ed;
  color: #1e8e3e;
}

.th-eval-workspace .ew-bubble-text {
  font-size: 13px;
  color: #1f2536;
  line-height: 1.42;
}

.th-eval-workspace .ew-bubble-status {
  font-size: 11px;
  color: #5a607a;
  background: #f0f2f8;
  border-radius: 4px;
  padding: 2px 6px;
  margin-bottom: 4px;
  display: inline-block;
}

.th-eval-workspace .ew-msg-system .ew-avatar {
  background: #8a9ab5;
}

.th-eval-workspace .ew-msg-system .ew-bubble {
  background: #f8f9fc;
  border-color: #e8eaf1;
}

.th-eval-workspace .ew-composer {
  padding: 12px 16px 15px;
  border-bottom: 1px solid #ebeff6;
  background: #fff;
  flex-shrink: 0;
}

.th-eval-workspace .ew-composer textarea {
  width: 100%;
  height: 60px;
  border: 1px solid #dbe1ec;
  border-radius: 8px;
  padding: 10px;
  font-size: 13px;
  margin-bottom: 8px;
  color: #2a3044;
  resize: none;
  font-family: inherit;
}

.th-eval-workspace .ew-composer-actions {
  display: flex;
  gap: 8px;
}

.th-eval-workspace .ew-btn-send {
  height: 34px;
  border: 0;
  border-radius: 0.5rem;
  padding: 0 14px;
  font-size: 0.875rem;
  background: var(--th-primary, #3539f0);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}

.th-eval-workspace .ew-btn-cancel {
  height: 34px;
  border: 1px solid #d5dbea;
  border-radius: 8px;
  padding: 0 12px;
  font-size: 12px;
  color: #35405f;
  background: #fff;
  font-weight: 600;
  cursor: pointer;
}

/* --- Empty & loading states --- */
.th-eval-workspace .ew-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  color: #647296;
  font-size: 15px;
  text-align: center;
  padding: 40px;
}

.th-eval-workspace .ew-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  color: #647296;
  font-size: 14px;
  gap: 12px;
}

.th-eval-workspace .ew-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid #e7eaf2;
  border-top-color: var(--th-primary, #3539f0);
  border-radius: 50%;
  animation: ew-spin 0.7s linear infinite;
}

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

/* --- Block banner --- */
.th-eval-workspace .ew-block-banner {
  background: #fff9e9;
  border: 1px solid #e4c96f;
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 13px;
  color: #8d7220;
  margin-bottom: 16px;
}

/* Tras completar una acción: salto a la siguiente tarea pendiente */
.th-eval-workspace .ew-next-task-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  background: #f0faf6;
  border: 1px solid #bfe8d6;
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 13px;
  color: #1f7a55;
  margin-bottom: 16px;
}
.th-eval-workspace .ew-next-task-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #1ab06f;
  color: #fff;
  font-size: 11px;
  margin-right: 4px;
  flex-shrink: 0;
}

.th-eval-workspace .ew-next-task-check svg {
  width: 10px;
  height: 10px;
}
.th-eval-workspace .ew-next-task-btn {
  border: none;
  background: var(--th-primary, #3539f0);
  color: #fff;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.th-eval-workspace .ew-next-task-btn:hover { opacity: 0.9; }

/* --- Read-only overlay text --- */
.th-eval-workspace .ew-readonly-badge {
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #f4f5f9;
  border: 1px solid #dde0ea;
  color: #5e6478;
  font-weight: 600;
}

/* --- Status point --- */
.th-eval-workspace .ew-status-point {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

.th-eval-workspace .ew-status-point.ew-pending { background: #f0b429; box-shadow: 0 0 0 3px #fdf3d7; }
.th-eval-workspace .ew-status-point.ew-approved { background: #1ab06f; box-shadow: 0 0 0 3px #ddf3e8; }
.th-eval-workspace .ew-status-point.ew-rejected { background: #e34d5f; box-shadow: 0 0 0 3px #fae1e5; }
.th-eval-workspace .ew-status-point.ew-review {
  background: var(--th-primary, #3539f0);
  box-shadow: 0 0 0 3px rgba(53, 57, 240, 0.12);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--th-primary, #3539f0) 12%, #fff);
}
.th-eval-workspace .ew-status-point.ew-expired { background: #9ca3af; box-shadow: 0 0 0 3px #eceef1; }
.th-eval-workspace .ew-status-point.ew-draft { background: #a0aec0; box-shadow: 0 0 0 3px #edf0f4; }

/* --- Template document form --- */
.th-eval-workspace .ew-template-document {
  padding: 24px;
}
.th-eval-workspace .ew-template-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.th-eval-workspace .ew-template-head h3 {
  font-size: 16px;
  font-weight: 600;
  margin: 0;
  color: #2d3748;
}
.th-eval-workspace .ew-template-intro {
  margin-bottom: 20px;
}

.th-eval-workspace .ew-template-file-card {
  margin: 10px 0 4px;
}
.th-eval-workspace .ew-template-success-message {
  padding: 16px 0;
}
.th-eval-workspace .ew-template-pdf-viewer {
  margin-top: 12px;
  border-radius: 8px;
  overflow: hidden;
}
.th-eval-workspace .ew-template-pdf-viewer iframe {
  display: block;
}
.th-eval-workspace .ew-template-fields {
  margin-bottom: 20px;
}
.th-eval-workspace .ew-template-fields .form-group {
  margin-bottom: 14px;
}
.th-eval-workspace .ew-template-fields label {
  font-size: 13px;
  font-weight: 500;
  color: #4a5568;
  margin-bottom: 4px;
}
.th-eval-workspace .ew-template-fields input,
.th-eval-workspace .ew-template-fields textarea,
.th-eval-workspace .ew-template-fields select {
  font-size: 13px;
  border-radius: 6px;
  border: 1px solid #cbd5e0;
}
.th-eval-workspace .ew-template-actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}
.th-eval-workspace .ew-template-btn.ew-submit {
  background: var(--th-primary, #3539f0);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 24px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: opacity .2s;
}
.th-eval-workspace .ew-template-btn.ew-submit:hover {
  opacity: .85;
}
.th-eval-workspace .ew-template-btn.ew-submit:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.th-eval-workspace .ew-btn-template {
  border-color: var(--th-primary, #3539f0);
  background: rgba(53, 57, 240, 0.08);
  border-color: color-mix(in srgb, var(--th-primary, #3539f0) 35%, #fff);
  background: color-mix(in srgb, var(--th-primary, #3539f0) 7%, #fff);
}
.th-eval-workspace .ew-btn-template .th-icon {
  opacity: 0.9;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-preview {
  background: #fff;
  border-color: #dfe5f2;
}

/* --- Upload spinner --- */
.th-eval-workspace .ew-spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(0,0,0,.15);
  border-top-color: var(--th-primary, #3539f0);
  border-radius: 50%;
  animation: ew-spin .6s linear infinite;
}
@keyframes ew-spin {
  to { transform: rotate(360deg); }
}

/* ==========================================================================
   Shared Documents integrated into workspace sidebar
   ========================================================================== */

.th-eval-workspace .ew-shared-docs-group .ew-eval-group-title {
  cursor: pointer;
}

.th-eval-workspace .ew-shared-docs-group .ew-eval-group-title:hover {
  background: #f0f2ff;
}

.th-eval-workspace .ew-shared-docs-group.ew-shared-docs-active .ew-eval-group-title {
  background: #eef3ff;
  color: var(--th-primary, #3539f0);
  border-radius: 8px;
}

.th-eval-workspace .ew-shared-docs-group.ew-shared-docs-active .ew-eval-group-title span:first-child {
  color: var(--th-primary, #3539f0);
  font-weight: 700;
}

.th-eval-workspace .ew-empty-shared-docs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 48px 24px;
  color: #647296;
  font-size: 14px;
  text-align: center;
}

.th-eval-workspace .ew-btn-add-shared-doc {
  margin-left: auto;
  flex-shrink: 0;
  height: 34px;
  border: 1px solid var(--th-primary, #3539f0);
  border-radius: 0.5rem;
  padding: 0 14px;
  font-size: 0.875rem;
  font-weight: 600;
  color: #fff;
  background: var(--th-primary, #3539f0);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: background .15s;
}

.th-eval-workspace .ew-btn-add-shared-doc:hover {
  background: #2830d4;
}

.th-eval-workspace .ew-doc-origin-chip {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f0f3fa;
  border: 1px solid #e2e6f0;
  color: #5a6a8a;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-delete {
  border-color: #f2b9c3;
  background: #fff2f4;
  color: #b73f58;
}

.th-eval-workspace .ew-btn-doc-action.ew-btn-delete:hover {
  background: #fce4ec;
}

/* --- Upload panel --- */
.th-eval-workspace .ew-upload-panel {
  padding: 24px;
}
.th-eval-workspace .ew-upload-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e2e8f0;
}
.th-eval-workspace .ew-upload-back {
  background: none;
  border: none;
  color: #4a5568;
  cursor: pointer;
  padding: 4px;
  border-radius: 6px;
  transition: background .15s;
}
.th-eval-workspace .ew-upload-back:hover {
  background: #f1f5f9;
}
.th-eval-workspace .ew-upload-title {
  font-size: 15px;
  font-weight: 600;
  color: #2d3748;
  margin: 0;
}
.th-eval-workspace .ew-upload-dropzone {
  border: 2px dashed #cbd5e0;
  border-radius: 12px;
  padding: 32px 24px;
  text-align: center;
  cursor: pointer;
  transition: border-color .2s, background .2s;
  margin-bottom: 16px;
}
.th-eval-workspace .ew-upload-dropzone:hover,
.th-eval-workspace .ew-upload-dropzone.ew-dragover {
  border-color: var(--th-primary, #3539f0);
  background: #f8faff;
}
.th-eval-workspace .ew-upload-icon {
  width: 48px;
  height: 48px;
  opacity: .6;
  margin-bottom: 12px;
}
.th-eval-workspace .ew-upload-drop-text {
  font-size: 14px;
  color: #4a5568;
  margin: 0 0 4px;
}
.th-eval-workspace .ew-upload-drop-note {
  font-size: 12px;
  color: #9ca3af;
  margin: 0;
}
.th-eval-workspace .ew-upload-file-info {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #f1f5f9;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 16px;
}
.th-eval-workspace .ew-upload-file-name {
  flex: 1;
  font-size: 13px;
  color: #2d3748;
  word-break: break-all;
}
.th-eval-workspace .ew-upload-file-remove {
  background: none;
  border: none;
  font-size: 18px;
  color: #e53e3e;
  cursor: pointer;
  line-height: 1;
}
.th-eval-workspace .ew-upload-progress {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.th-eval-workspace .ew-upload-progress-bar {
  flex: 1;
  height: 6px;
  background: #e2e8f0;
  border-radius: 3px;
  overflow: hidden;
}
.th-eval-workspace .ew-upload-progress-fill {
  height: 100%;
  background: var(--th-primary, #3539f0);
  border-radius: 3px;
  width: 0;
  transition: width .3s ease;
}
.th-eval-workspace .ew-upload-progress-text {
  font-size: 12px;
  color: #718096;
  white-space: nowrap;
}
.th-eval-workspace .ew-upload-actions {
  display: flex;
  justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}
.th-eval-workspace .ew-upload-btn {
  border: none;
  border-radius: 0.5rem;
  padding: 10px 20px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity .2s;
}
.th-eval-workspace .ew-upload-btn.ew-cancel {
  background: #f1f5f9;
  color: #4a5568;
}
.th-eval-workspace .ew-upload-btn.ew-confirm {
  background: var(--th-primary, #3539f0);
  color: #fff;
}
.th-eval-workspace .ew-upload-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

/* --- Upload name field --- */
.th-eval-workspace .ew-upload-field-group {
  padding: 0 0px 16px;
}

.th-eval-workspace .ew-upload-field-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #4a5568;
  margin-bottom: 6px;
}

.th-eval-workspace .ew-upload-field-input {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid #cbd5e0;
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  box-sizing: border-box;
  font-family: inherit;
  color: #2d3748;
  background: #fff;
  transition: border-color .15s;
}

.th-eval-workspace .ew-upload-field-input:focus {
  border-color: var(--th-primary, #3539f0);
}

/* --- Responsive --- */
@media (max-width: 1280px) {
  .th-eval-workspace {
    grid-template-columns: 1fr;
  }

  .th-eval-workspace .ew-left {
    border-right: 0;
    border-bottom: 1px solid var(--th-border, #e4eaf7);
    max-height: 360px;
    overflow-y: auto;
  }

  .th-eval-workspace .ew-drawer {
    width: min(92vw, 470px);
  }

  /* On mobile: show inline status, hide column status */
  .th-eval-workspace .ew-doc-name .ew-doc-status {
    display: inline-flex;
  }
  .th-eval-workspace .ew-doc-row > .ew-doc-status {
    display: none;
  }
  .th-eval-workspace .ew-doc-row:first-child > div:nth-child(2) {
    display: none;
  }
  .th-eval-workspace .ew-doc-row {
    grid-template-columns: 1fr auto;
  }
}

/* -----------------------------------------------------------
   PER-QUESTION COMMENTS (forms)
   ----------------------------------------------------------- */

/* Solo el enunciado comparte línea con el icono: el resto del campo (input, barra
   de comentarios) ocupa el ancho completo, como en el diseño */
.th-eval-workspace .ew-q-host {
  position: relative;
}

.th-eval-workspace .ew-q-host > label {
  display: block;
  padding-right: 40px;
}

.th-eval-workspace .ew-q-comments {
  margin: 0;
}

/* Botón icono junto al enunciado (28px, a la derecha del todo, siempre en la misma posición) */
.th-eval-workspace .ew-q-toggle {
  position: absolute;
  top: 0;
  right: 0;
  width: 28px;
  height: 28px;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  background: #fff;
  color: #949494;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  line-height: 1;
}

.th-eval-workspace .ew-q-toggle:hover {
  color: var(--th-primary, #3539f0);
  border-color: var(--th-primary, #3539f0);
}

.th-eval-workspace .ew-q-toggle-badge {
  position: absolute;
  bottom: -6px;
  right: -6px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #ff6f4a;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 2px #fff;
}

.th-eval-workspace .ew-q-has-comments .ew-q-toggle {
  background: var(--th-primary, #3539f0);
  border-color: var(--th-primary, #3539f0);
  color: #fff;
}

/* Barra plegable "Comentarios — Pregunta" bajo el campo */
.th-eval-workspace .ew-q-bar {
  margin-top: 12px;
  border: 1px solid #e8e8e8;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

.th-eval-workspace .ew-q-bar-head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: #fff;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
}

.th-eval-workspace .ew-q-open .ew-q-bar-head {
  background: #dbe7fb;
}

.th-eval-workspace .ew-q-bar-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--th-primary, #3539f0);
}

.th-eval-workspace .ew-q-bar-title svg {
  flex-shrink: 0;
}

.th-eval-workspace .ew-q-bar-label {
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.th-eval-workspace .ew-q-bar-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  color: #1f2536;
}

.th-eval-workspace .ew-q-count {
  font-size: 12px;
  font-weight: 500;
  color: var(--th-primary, #3539f0);
}

.th-eval-workspace .ew-q-chevron {
  transition: transform 0.15s ease;
}

.th-eval-workspace .ew-q-open .ew-q-chevron {
  transform: rotate(180deg);
}

/* Hilo desplegado */
.th-eval-workspace .ew-q-body {
  background: #dbe7fb;
  padding: 0 12px 12px;
}

.th-eval-workspace .ew-q-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-top: 8px;
  margin-bottom: 12px;
  max-height: 280px;
  overflow-y: auto;
}

.th-eval-workspace .ew-q-item {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}

.th-eval-workspace .ew-q-item-main {
  min-width: 0;
}

.th-eval-workspace .ew-q-item-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.th-eval-workspace .ew-q-item-author {
  font-size: 12px;
  font-weight: 600;
  color: #1f2536;
}

.th-eval-workspace .ew-q-item-time {
  font-size: 12px;
  color: #949494;
}

.th-eval-workspace .ew-q-item-text {
  font-size: 12px;
  color: #1f2536;
  line-height: 1.45;
  margin: 2px 0 0;
}

.th-eval-workspace .ew-q-empty {
  font-size: 12px;
  color: #72798e;
  padding: 8px 0 4px;
}

/* Composer: avatar + caja blanca con botón circular de enviar */
.th-eval-workspace .ew-q-composer {
  display: flex;
  gap: 8px;
  align-items: center;
}

.th-eval-workspace .ew-q-me {
  background: #d7dbe8;
  color: #5e6478;
}

.th-eval-workspace .ew-q-input {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 12px;
  padding: 5px 5px 5px 12px;
  min-width: 0;
}

.th-eval-workspace .ew-q-input input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  font-size: 12px;
  color: #1f2536;
  font-family: inherit;
  padding: 0;
  min-width: 0;
}

.th-eval-workspace .ew-q-input input:focus {
  outline: none;
  box-shadow: none;
  border: 0;
}

.th-eval-workspace .ew-q-input input::placeholder {
  color: #949494;
}

.th-eval-workspace .ew-q-send {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--th-primary, #3539f0);
  color: #fff;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  margin: 0;
  flex-shrink: 0;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  line-height: 1;
}

.th-eval-workspace .ew-q-send:disabled {
  opacity: 0.6;
  cursor: default;
}

/* ==========================================================================
   People Compliance: panel "Instrucciones y ayuda" (ew-help-*)
   Entrada de sidebar con estilo de sección (misma interacción que el grupo
   de documentos compartidos, clase propia) + panel de contenido renderizado
   por EditorJsHelpRenderer. Acento verde de la paleta existente (#1ab06f).
   ========================================================================== */

.th-eval-workspace .ew-help-group .ew-eval-group-title {
  cursor: pointer;
}

.th-eval-workspace .ew-help-group .ew-eval-group-title:hover {
  background: #edf9f3;
}

.th-eval-workspace .ew-help-group.ew-help-active .ew-eval-group-title {
  background: #edf9f3;
  color: #2f7c57;
  border-radius: 8px;
}

.th-eval-workspace .ew-help-group.ew-help-active .ew-eval-group-title span:first-child {
  color: #2f7c57;
  font-weight: 700;
}

.th-eval-workspace .ew-help-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #edf9f3;
  border: 1px solid #a8dfc6;
  color: #1ab06f;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}

.th-eval-workspace .ew-help-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding-bottom: 16px;
  margin-bottom: 18px;
  border-bottom: 1px solid #e4eaf7;
}

.th-eval-workspace .ew-help-head-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #edf9f3;
  flex-shrink: 0;
}

.th-eval-workspace .ew-help-head-icon .ew-help-badge {
  width: 26px;
  height: 26px;
  font-size: 15px;
  border: none;
  background: transparent;
}

.th-eval-workspace .ew-help-subtitle {
  margin: 4px 0 0;
  color: #65739a;
  font-size: 14px;
}

.th-eval-workspace .ew-help-heading {
  margin: 22px 0 12px;
  color: #20244f;
  font-size: 16px;
  font-weight: 700;
}

.th-eval-workspace .ew-help-p {
  margin: 0 0 10px;
  color: #65739a;
  font-size: 14px;
  line-height: 1.55;
}

.th-eval-workspace .ew-help-list {
  margin: 0 0 12px;
  padding-left: 20px;
  color: #65739a;
  font-size: 14px;
  line-height: 1.55;
}

.th-eval-workspace .ew-help-delimiter {
  border: 0;
  border-top: 1px solid #e4eaf7;
  margin: 18px 0;
}

.th-eval-workspace .ew-help-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 8px;
}

.th-eval-workspace .ew-help-step-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border: 1px solid #e4eaf7;
  border-radius: 10px;
  background: #fff;
}

.th-eval-workspace .ew-help-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #eef3ff;
  color: var(--th-primary, #3539f0);
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}

.th-eval-workspace .ew-help-step-title {
  margin: 3px 0 6px;
  color: #20244f;
  font-size: 14px;
  font-weight: 700;
}

.th-eval-workspace .ew-help-step-body .ew-help-p {
  margin-bottom: 0;
}

.th-eval-workspace .ew-help-guide-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-bottom: 8px;
}

.th-eval-workspace .ew-help-guide-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px;
  border: 1px solid #e4eaf7;
  border-radius: 10px;
  background: #fff;
}

.th-eval-workspace .ew-help-guide-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #f5f7fd;
  flex-shrink: 0;
}

.th-eval-workspace .ew-help-guide-icon img {
  width: 22px;
  height: 22px;
}

.th-eval-workspace .ew-help-guide-title {
  margin: 2px 0 6px;
  color: #20244f;
  font-size: 14px;
  font-weight: 700;
}

.th-eval-workspace .ew-help-guide-body .ew-help-p {
  margin-bottom: 0;
}

@media (max-width: 991px) {
  .th-eval-workspace .ew-help-steps {
    grid-template-columns: 1fr;
  }

  .th-eval-workspace .ew-help-guide-grid {
    grid-template-columns: 1fr;
  }
}
