/* Styles spécifiques au module Besoins. */

.needs-table-wide .need-row.is-even { background: #eef4fb; }
.needs-table-wide .need-row.is-odd { background: #ffffff; }
.needs-table-wide .need-row:hover { background: #e5f0ff; }

.need-row > strong {
  display: grid;
  justify-items: start;
  gap: 4px;
}

.need-hero-add-button {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 8px 16px 8px 10px;
  border: 1px solid #b9d8ee;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef9ff, #f6fff6);
  color: #123f73;
  box-shadow: 0 12px 26px rgba(18, 102, 241, 0.12);
  cursor: pointer;
}

.need-hero-add-button:hover {
  transform: translateY(-1px);
  border-color: #45a56f;
  box-shadow: 0 16px 34px rgba(18, 102, 241, 0.18);
}

.need-hero-add-visual {
  position: relative;
  width: 54px;
  height: 42px;
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(18, 102, 241, 0.18) 0 42%, transparent 42%),
    linear-gradient(135deg, #1266f1, #45a56f);
  overflow: hidden;
}

.need-hero-add-visual::before,
.need-hero-add-visual::after,
.need-hero-add-visual span {
  content: "";
  position: absolute;
  left: 22px;
  right: 8px;
  height: 3px;
  border-radius: 999px;
  background: #fff;
}

.need-hero-add-visual::before { top: 12px; }
.need-hero-add-visual span { top: 20px; }
.need-hero-add-visual::after { top: 28px; }

.need-hero-add-button strong {
  font-size: 15px;
}

.need-close-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
  margin: 12px 0 16px;
  padding: 14px;
  border: 1px solid #fecaca;
  border-radius: 12px;
  background: #fff5f5;
}

.need-close-panel label {
  display: grid;
  gap: 6px;
  color: #7f1d1d;
  font-weight: 800;
}

.need-close-panel textarea {
  min-height: 76px;
  resize: vertical;
  border: 1px solid #f5b5b5;
  border-radius: 10px;
  padding: 10px;
  background: #fff;
  color: #18324a;
}

.status-action.close {
  background: #fef2f2;
  color: #991b1b;
  border-color: #fecaca;
}

.need-type-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #dbeafe;
  color: #164e8a;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.need-type-maintenance { background: #dbeafe; color: #174ea6; }
.need-type-achat { background: #dcfce7; color: #166534; }
.need-type-contrat { background: #ede9fe; color: #5b21b6; }
.need-type-materiovigilance { background: #fee2e2; color: #991b1b; }
.need-type-audit { background: #ffedd5; color: #9a3412; }
.need-type-visite { background: #cffafe; color: #155e75; }

.need-title-text {
  color: #102f4f;
  line-height: 1.3;
}

.need-file-cell {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.need-paperclip {
  position: relative;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #b8cee5;
  border-radius: 50%;
  background: #fff;
  color: #0b5ed7;
  cursor: pointer;
  font-size: 18px;
}

.need-paperclip small {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 17px;
  height: 17px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #0b5ed7;
  color: #fff;
  font-size: 9px;
}

.need-modal-header-right,
.need-modal-depositor {
  display: flex;
  align-items: center;
}

.need-modal-header-right { gap: 14px; }

.need-modal-depositor {
  max-width: 360px;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
}

.need-modal-depositor span {
  color: #6b7f94;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.need-modal-depositor strong {
  overflow-wrap: anywhere;
  color: #102f4f;
  font-size: 13px;
}

.need-request-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(220px, 3fr);
  gap: 14px;
  align-items: stretch;
  margin-top: 16px;
}

.need-request-content-grid .need-readonly-card { margin: 0; }

.need-request-attachments {
  margin: 0;
  padding: 16px;
  border: 1px solid #cbdbea;
  background: #f7fbff;
}

.need-attachment-link,
.need-message-attachment {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 9px;
  color: #0b5ed7;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.need-attachment-link span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.need-addition-panel {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #bdd2e8;
  background: #eaf3fc;
}

.biopartner-response-composer {
  margin-top: 16px;
  border-top: 4px solid #1266f1;
  background: #eef6ff;
}

.need-addition-panel .need-reply-composer {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.need-followup-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.need-followup-upload strong {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 7px;
  padding: 0 14px;
  border-radius: 7px;
  background: #123f73;
  color: #fff;
  cursor: pointer;
}

.need-addition-submit {
  display: flex;
  margin: 12px 0 0 auto;
}

@media (max-width: 780px) {
  .need-modal-header-right { align-items: flex-start; }
  .need-modal-depositor { max-width: 190px; }
  .need-request-content-grid { grid-template-columns: 1fr; }
}

.needs-tabs {
  margin: 4px 0 12px;
}

.needs-toolbar {
  align-items: center;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.needs-toolbar .filters {
  flex: 1 1 100%;
}

#needsStatusFilter {
  width: 148px;
  flex: 0 0 148px;
}

#needsSearch {
  flex: 1 1 260px;
  min-width: 220px;
}

.needs-date-range {
  display: inline-grid;
  grid-template-columns: repeat(2, max-content);
  gap: 8px;
  align-items: center;
  white-space: nowrap;
}

.needs-date-range label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #63748a;
  font-size: 12px;
  font-weight: 800;
}

.needs-date-range input,
#needsStatusFilter,
#needsSortFilter {
  min-height: 38px;
  border: 1px solid #d8e5f2;
  border-radius: 8px;
  padding: 0 9px;
  background: #fff;
  color: #18324a;
  font-weight: 750;
}

#needsSortFilter {
  width: 238px;
  flex: 0 0 238px;
}

.need-hero-add-button {
  min-height: 82px;
  width: min(260px, 100%);
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  padding: 0;
  overflow: hidden;
  border-radius: 8px;
  background: #fff;
  text-align: left;
}

.need-hero-add-button img {
  width: 92px;
  height: 82px;
  object-fit: cover;
}

.need-hero-add-button > span:not(.need-hero-add-visual) {
  display: grid;
  align-content: center;
  gap: 4px;
  padding-right: 12px;
}

.need-hero-add-button small {
  color: #63748a;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
}

.need-record-footer-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #e3edf7;
}

.need-closure-modal {
  width: min(880px, calc(100vw - 28px));
}

.need-closure-intro {
  color: #63748a;
  font-weight: 700;
  line-height: 1.5;
}

.need-closure-field {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  color: #7f1d1d;
  font-weight: 850;
}

.need-closure-field textarea {
  min-height: 170px;
  resize: vertical;
  border: 1px solid #f2b7b7;
  border-radius: 10px;
  padding: 12px;
  background: #fffafa;
  color: #18324a;
}

.needs-analysis-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.needs-analysis-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.needs-vertical-histogram {
  display: grid;
  grid-template-columns: repeat(6, minmax(86px, 1fr));
  gap: 14px;
  min-height: 320px;
  align-items: end;
  padding: 12px 0 0;
}

.needs-histogram-group {
  display: grid;
  grid-template-rows: minmax(220px, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.needs-histogram-bars {
  height: 230px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  align-items: end;
  padding: 10px 8px 0;
  border-bottom: 1px solid #cad8e7;
  background: linear-gradient(180deg, #f9fcff, #ffffff);
}

.needs-histogram-bar {
  height: 100%;
  min-width: 0;
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 6px;
  justify-items: center;
  border: 0;
  background: transparent;
  color: #18324a;
  cursor: pointer;
}

.needs-histogram-bar:disabled {
  cursor: default;
  opacity: 0.36;
}

.needs-histogram-bar span {
  width: 100%;
  min-height: 3px;
  align-self: end;
  border-radius: 7px 7px 0 0;
  background: #1266f1;
  height: var(--height);
  transition: filter 0.18s ease;
}

.needs-histogram-bar:hover:not(:disabled) span {
  filter: brightness(0.92);
}

.needs-histogram-bar.status-progress span { background: #1266f1; }
.needs-histogram-bar.status-accepted span { background: #16a34a; }
.needs-histogram-bar.status-work span { background: #f59e0b; }
.needs-histogram-bar.status-closed span { background: #7c3aed; }

.needs-histogram-bar b {
  font-size: 12px;
  font-weight: 900;
}

.needs-histogram-group > strong {
  overflow-wrap: anywhere;
  color: #08234a;
  font-size: 12px;
  text-align: center;
}

.needs-analysis-kpi {
  min-height: 118px;
  display: grid;
  gap: 6px;
  align-content: center;
  padding: 16px;
  border: 1px solid #dbe7f3;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 24px rgba(6, 42, 95, 0.07);
}

.needs-analysis-kpi span {
  color: #63748a;
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.needs-analysis-kpi strong {
  color: #08234a;
  font-size: 28px;
  line-height: 1;
}

.needs-analysis-kpi small {
  color: #63748a;
  font-weight: 700;
}

.needs-analysis-kpi.tone-blue { border-top: 4px solid #1266f1; }
.needs-analysis-kpi.tone-green { border-top: 4px solid #16a34a; }
.needs-analysis-kpi.tone-orange { border-top: 4px solid #f59e0b; }
.needs-analysis-kpi.tone-red { border-top: 4px solid #ef4444; }
.needs-analysis-kpi.tone-navy { border-top: 4px solid #123f73; }
.needs-analysis-kpi.tone-purple { border-top: 4px solid #7c3aed; }

.needs-analysis-panels {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
  gap: 14px;
  margin-top: 14px;
}

.needs-pie-layout {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 14px;
}

.needs-pie-chart {
  position: relative;
  width: 190px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  box-shadow: 0 12px 24px rgba(6, 42, 95, 0.1);
  overflow: hidden;
}

.needs-pie-chart svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.needs-pie-slice {
  cursor: pointer;
  stroke: #fff;
  stroke-width: 1;
  transition: filter 0.18s ease;
}

.needs-pie-slice:hover {
  filter: brightness(0.9);
}

.needs-pie-chart span {
  position: relative;
  z-index: 1;
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: #08234a;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.needs-pie-legend {
  display: grid;
  gap: 8px;
}

.needs-pie-legend button {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid #d8e5f2;
  border-radius: 8px;
  background: #fff;
  color: #18324a;
  cursor: pointer;
}

.needs-pie-legend button:disabled {
  cursor: default;
  opacity: 0.45;
}

.needs-pie-legend i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.needs-pie-legend span {
  font-weight: 800;
}

.needs-pie-legend strong {
  color: #08234a;
}

.needs-status-chart {
  display: grid;
  gap: 12px;
}

.needs-status-chart article {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 46px;
  gap: 12px;
  align-items: center;
}

.needs-status-chart span {
  color: #18324a;
  font-weight: 800;
}

.needs-status-chart mark {
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1266f1 var(--value), #e7eef6 var(--value));
}

.needs-status-chart strong {
  color: #08234a;
  text-align: right;
}

.needs-treatment-summary {
  display: grid;
  gap: 10px;
}

.needs-treatment-summary article {
  display: grid;
  gap: 3px;
  padding: 14px;
  border: 1px solid #dbe7f3;
  border-radius: 8px;
  background: #f7fbff;
}

.needs-treatment-summary span {
  color: #63748a;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.needs-treatment-summary strong {
  color: #08234a;
  font-size: 22px;
}

@media (max-width: 1100px) {
  .needs-analysis-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .needs-analysis-panels { grid-template-columns: 1fr; }
  .needs-vertical-histogram { grid-template-columns: repeat(3, minmax(86px, 1fr)); }
}

@media (max-width: 780px) {
  .need-hero-add-button { width: 100%; }
  .needs-analysis-grid { grid-template-columns: 1fr 1fr; }
  .needs-vertical-histogram { grid-template-columns: repeat(2, minmax(86px, 1fr)); }
  .needs-pie-layout { grid-template-columns: 1fr; justify-items: center; }
  .needs-date-range { grid-template-columns: 1fr; }
  .needs-status-chart article { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .needs-analysis-grid,
  .needs-vertical-histogram {
    grid-template-columns: 1fr;
  }

  .needs-histogram-bars {
    height: 170px;
  }

  .needs-pie {
    width: min(220px, 74vw);
    height: min(220px, 74vw);
  }
}

@media print {
  body.printing-needs-analysis {
    background: #fff !important;
  }

  body.printing-needs-analysis * {
    visibility: hidden !important;
  }

  body.printing-needs-analysis #needsAnalysisReport,
  body.printing-needs-analysis #needsAnalysisReport * {
    visibility: visible !important;
  }

  body.printing-needs-analysis #needsAnalysisReport {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    background: #fff;
  }

  body.printing-needs-analysis .sidebar,
  body.printing-needs-analysis .mobile-app-bar,
  body.printing-needs-analysis .topbar,
  body.printing-needs-analysis .needs-tabs,
  body.printing-needs-analysis .needs-toolbar,
  body.printing-needs-analysis .section-header,
  body.printing-needs-analysis .tab-pane:not(#needs-analysis),
  body.printing-needs-analysis #printNeedsAnalysis {
    display: none !important;
  }

  body.printing-needs-analysis .app-shell,
  body.printing-needs-analysis .main,
  body.printing-needs-analysis .view,
  body.printing-needs-analysis #needs-analysis {
    display: block !important;
    overflow: visible !important;
    height: auto !important;
  }

  body.printing-needs-analysis .needs-analysis-report {
    padding: 0;
  }
}