/* Zoning : documents, fenêtre de zone, attributions agents — ordre des sections = ordre de priorité, ne pas réordonner. */

/* ===== zoning-documents-v32 ===== */
#zoningDialog {
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  overflow: auto;
}

#zoningDialog .modal-head {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 22px clamp(16px,3vw,48px);
  background: linear-gradient(110deg,#063e50,#087e89 70%,#18a7a4);
  box-shadow: 0 8px 28px #063e5026;
}

#zoningDialog .modal-head h2,#zoningDialog .modal-head .close {
  color: #fff;
}

#zoningDialog .modal-head h2 {
  font-size: 25px;
  letter-spacing: .01em;
}

#zoningDialog .modal-head .close {
  width: 40px;
  height: 40px;
  border: 1px solid #ffffff77;
  border-radius: 10px;
  background: #ffffff1f;
}

#zoningDialog .work-form {
  margin: auto;
}

#zoningDialog .form-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  background: var(--surface);
  border-top: 1px solid var(--line);
}

.zone-documents {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
}

.zone-documents h3 {
  grid-column: 1/-1;
  margin: 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--accent);
  font-size: 20px;
}

.zone-document-card {
  min-width: 0;
  border: 1px solid #c9e2e2;
  border-radius: 16px;
}

.zone-document-card h4 {
  margin: 0 0 6px;
  color: var(--accent);
  font-size: 17px;
}

.zone-document-card p {
  color: var(--muted);
  font-size: 12px;
}

.zone-document-card input[type=file] {
  width: 100%;
}

.zone-document-card input[type=file]::file-selector-button {
  margin-right: 12px;
  border: 0;
  border-radius: 8px;
  background: #087e89;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}

.zone-document-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.zone-document-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
}

.zone-document-item strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 12px;
}

.zone-document-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.zone-document-actions button {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--accent);
  font-weight: 800;
}

.zone-document-actions button:hover {
  border-color: #087e89;
  background: #e9f8f8;
}

.zone-document-empty {
  padding: 12px;
  border-radius: 9px;
  background: #f4f8f9;
}

.zone-document-status {
  grid-column: 1/-1;
  color: var(--muted);
  font-size: 12px;
}

.zone-document-status.error {
  color: var(--red);
}

.zone-document-preview {
  grid-column: 1/-1;
  min-height: 500px;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

.zone-document-preview[hidden] {
  display: none;
}

#zoningDialog .zone-document-preview[hidden] {
  display: none!important;
}

.zone-document-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
}

.zone-document-preview iframe,.zone-document-preview img {
  display: block;
  width: 100%;
  height: min(65dvh,800px);
  border: 0;
  object-fit: contain;
}

.zone-import {
  grid-column: 1/-1;
}

.zone-import h3 {
  color: #075f68;
  font-size: 19px;
}

.zone-import p {
  color: var(--muted);
}

.zone-import-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.zone-import-status {
  margin: 10px 0;
  color: #375d66;
  font-size: 13px;
}

.zone-import-status.error {
  color: var(--red);
}

.zone-import-preview {
  margin-top: 12px;
}

.zone-import-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.zone-import-summary span {
  padding: 7px 10px;
  border-radius: 8px;
  background: #dff2f0;
  color: #075f68;
  font-size: 12px;
  font-weight: 800;
}

.zone-pieces-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.zone-pieces-table th,.zone-pieces-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #d9ebea;
  text-align: left;
}

.zone-pieces-table th {
  position: sticky;
  top: 0;
  background: #e6f5f4;
  color: #075f68;
}

.zone-pieces-table td:nth-child(3) {
  text-align: right;
  white-space: nowrap;
}

.zone-pieces-scroll {
  max-height: 330px;
  overflow: auto;
  border: 1px solid #d9ebea;
  border-radius: 9px;
  background: #fff;
}

.zone-agent-field {
  grid-column: span 2;
}

.zone-agent-field>span {
  display: block;
  margin-bottom: 7px;
}

.zone-agent-picker {
  min-width: 0;
}

.zone-agent-picker input[type=search] {
  width: 100%;
}

.zone-agent-count {
  display: block;
  margin-bottom: 10px;
  font-weight: 800;
}

.zone-agent-help {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.zone-agent-choices {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  align-content: start;
  overflow: auto;
  padding: 2px;
}

#zoneAgentField .zone-agent-option {
  display: grid;
  grid-template-columns: 18px minmax(0,1fr);
  align-items: center;
  gap: 11px;
  min-width: 0;
  margin: 0;
  border: 1px solid #d3e4e5;
  border-radius: 9px;
  background: #fff;
  color: #24424b;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0;
  text-align: left;
  text-transform: none;
  cursor: pointer;
  transition: background .15s,border-color .15s,box-shadow .15s;
}

#zoneAgentField .zone-agent-option:hover {
  border-color: #71bfc1;
  background: #f1fbfa;
}

#zoneAgentField .zone-agent-option:focus-within {
  outline: 2px solid #087e89;
  outline-offset: 1px;
}

#zoneAgentField .zone-agent-option:has(input:checked) {
  border-color: #0a8d92;
  background: #e4f5f4;
  color: #064e58;
  box-shadow: inset 3px 0 #0a8d92;
}

#zoneAgentField .zone-agent-option[hidden] {
  display: none;
}

#zoneAgentField .zone-agent-option input[type=checkbox] {
  appearance: auto;
  width: 16px;
  min-width: 16px;
  max-width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  box-shadow: none;
  accent-color: #087e89;
  justify-self: start;
}

.zone-agent-name {
  min-width: 0;
  overflow-wrap: anywhere;
}

.zoning-attachments-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  padding: 5px 7px;
  border: 1px solid #b8dbdb;
  border-radius: 999px;
  background: #e9f8f7;
  color: #087e89;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.zoning-attachments-indicator svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.zoning-status-badges {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
}

.zoning-information b {
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.zoning-zone-meta .zoning-information {
  background: #fff1c2;
  color: #805500;
}

.zoning-zone-meta .zoning-information b {
  color: #5d3f00;
}

.zoning-detail-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border: 1px solid #b7dfca;
  border-radius: 999px;
  background: #e8f8ef;
  color: #187449;
  line-height: 1;
}

.zoning-detail-indicator svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#zoningDialog.preview-open {
  overflow: hidden;
}

#zoningDialog .zone-document-preview.is-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 25;
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #eef6f6;
}

#zoningDialog .zone-document-preview.is-fullscreen .zone-document-preview-head {
  flex: 0 0 auto;
  gap: 12px;
  padding: 14px clamp(16px,3vw,32px);
  background: #075f68;
  color: #fff;
}

#zoningDialog .zone-document-preview.is-fullscreen .zone-document-preview-head strong {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
}

#zoningDialog .zone-document-preview.is-fullscreen .zone-document-preview-head .ghost {
  border-color: #fff;
  background: #fff;
  color: #075f68;
  font-weight: 800;
}

#zoningDialog .zone-document-preview.is-fullscreen .zone-document-preview-head .ghost:hover,#zoningDialog .zone-document-preview.is-fullscreen .zone-document-preview-head .ghost:focus-visible {
  border-color: #a9e2db;
  background: #dff5f2;
  color: #064b53;
}

#zoningDialog .zone-document-preview.is-fullscreen #zonePreviewContent {
  flex: 1;
  min-height: 0;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 12px;
}

#zoningDialog .zone-document-preview.is-fullscreen iframe {
  width: 100%;
  height: 100%;
  background: #fff;
}

#zoningDialog .zone-document-preview.is-fullscreen img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#zoningContent .zoning-zone[data-zone-open] {
  cursor: pointer;
}

#zoningContent .zoning-zone[data-zone-open]:focus-visible {
  outline: 3px solid #087e89;
  outline-offset: 3px;
}

@media(max-width:900px) {
  .zone-documents {
    grid-template-columns: 1fr;
  }
}

@media(max-width:600px) {
  .zone-agent-field {
    grid-column: 1;
  }
  .zone-document-item {
    align-items: flex-start;
    flex-direction: column;
  }
  .zone-document-actions {
    justify-content: flex-start;
  }
}

/* ===== zoning-modal-polish-v338 ===== */
#zoningDialog .work-form {
  grid-template-columns: repeat(4,minmax(0,1fr));
  align-items: start;
  gap: 12px 18px;
}

#zoningDialog .field {
  align-self: start;
  min-width: 0;
  gap: 5px;
}

#zoningDialog .field>span {
  font-size: 11px;
  font-weight: 800;
  color: #375a62;
}

#zoningDialog .field input:not([type=checkbox]),#zoningDialog .field select {
  height: 40px;
  min-height: 40px;
  padding: 8px 11px;
}

#zoningDialog .field textarea {
  min-height: 66px;
}

#zoningDialog .field[hidden],#zoneAgentField[hidden],#zoneSocieteField[hidden] {
  display: none!important;
}

.zone-section-label {
  grid-column: 1/-1;
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 4px 0 1px;
  color: #075f68;
  font-size: 14px;
  font-weight: 900;
}

.zone-section-label span,.zone-documents h3 span,.zone-import h3 span {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: #dff2f0;
  color: #087e89;
  font-size: 11px;
  font-weight: 900;
}

#zoneAgentField {
  grid-column: 1/-1;
  margin-top: 2px;
}

.zone-agent-picker {
  padding: 11px;
  border: 1px solid #d5e7e6;
  border-radius: 12px;
  background: #f8fcfb;
}

.zone-agent-selected {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  min-height: 29px;
}

.zone-agent-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px 5px 5px;
  border-radius: 999px;
  background: #dff2ed;
  color: #126548;
  font-size: 12px;
  font-weight: 800;
}

.zone-agent-chip i {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #158b73;
  color: #fff;
  font-size: 10px;
  font-style: normal;
}

.zone-agent-none {
  color: #6b8389;
  font-size: 12px;
}

.zone-agent-disclosure {
  margin-top: 8px;
  border-top: 1px solid #dcebea;
}

.zone-agent-disclosure summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 2px 2px;
  color: #087e89;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}

.zone-agent-disclosure summary::-webkit-details-marker,.zone-document-card summary::-webkit-details-marker,.zone-level summary::-webkit-details-marker {
  display: none;
}

.zone-agent-disclosure summary span:before {
  content: '＋';
  margin-right: 7px;
  font-size: 15px;
}

.zone-agent-disclosure[open] summary span:before {
  content: '−';
}

.zone-agent-count {
  margin: 0;
  color: #57777c;
  font-size: 11px;
}

.zone-agent-select-body {
  padding-top: 11px;
}

.zone-agent-picker input[type=search] {
  margin-bottom: 7px;
}

.zone-agent-help {
  margin: 0 0 9px;
}

.zone-agent-choices {
  max-height: 208px;
  gap: 6px;
}

#zoneAgentField .zone-agent-option {
  min-height: 38px;
  padding: 7px 10px;
  font-size: 11px;
}

.zone-documents {
  align-items: start;
  gap: 12px;
  margin-top: 2px;
}

.zone-documents h3,.zone-import h3 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 12px 0 2px;
  border-top: 1px solid #d2e7e6;
  color: #075f68;
  font-size: 16px;
}

.zone-document-card {
  padding: 0;
  box-shadow: none;
  background: #fff;
  border-color: #d5e7e6;
  overflow: hidden;
}

.zone-document-card summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 52px;
  padding: 11px 15px;
  cursor: pointer;
  list-style: none;
}

.zone-document-card summary strong {
  font-size: 13px;
  color: #0a6470;
}

.zone-document-card summary small {
  margin-left: auto;
  color: #557980;
  font-size: 11px;
  font-weight: 700;
}

.zone-document-card summary:after {
  content: '⌄';
  margin-left: 6px;
  color: #087e89;
  font-size: 18px;
  line-height: 1;
}

.zone-document-card[open] summary:after {
  transform: rotate(180deg);
}

.zone-document-card[open] summary {
  border-bottom: 1px solid #dcebea;
  background: #f7fcfb;
}

.zone-document-body {
  padding: 14px;
}

.zone-document-card p {
  margin: 0 0 9px;
}

.zone-document-card input[type=file] {
  padding: 8px;
  border: 1px dashed #93c9c6;
  border-radius: 8px;
  background: #f5fbfa;
  font-size: 11px;
}

.zone-document-card input[type=file]::file-selector-button {
  padding: 7px 10px;
}

.zone-document-item {
  padding: 7px 9px;
}

.zone-document-actions button {
  padding: 5px 7px;
}

.zone-document-status {
  min-height: 0;
}

.zone-document-status:empty {
  display: none;
}

.zone-import {
  padding: 0 0 16px;
  border: 0;
  border-radius: 0;
  background: none;
}

.zone-import h3 {
  margin: 0 0 9px;
}

.zone-import p {
  margin: 0 0 11px;
  font-size: 12px;
}

.zone-import-controls input {
  flex: 1;
  max-width: 430px;
  min-width: 230px;
  padding: 9px;
  border: 1px dashed #93c9c6;
  border-radius: 8px;
  background: #f5fbfa;
  font-size: 11px;
}

.zone-import-controls .action-main {
  padding: 10px 14px;
  border-radius: 9px;
  box-shadow: none;
}

.zone-import-controls .action-main:disabled {
  opacity: .48;
  cursor: not-allowed;
  transform: none;
}

.zone-import-status:empty {
  display: none;
}

.zone-import-preview {
  padding: 12px;
  border: 1px solid #d5e7e6;
  border-radius: 11px;
  background: #f8fcfb;
}

.zone-import-preview h4,#zonePiecesExisting h4 {
  margin: 5px 0 10px;
  color: #075f68;
  font-size: 13px;
}

#zonePiecesExisting {
  margin-top: 12px;
}

.zone-level {
  margin: 7px 0;
  border: 1px solid #d8e9e7;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

.zone-level summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  color: #164d58;
  font-size: 12px;
  cursor: pointer;
  list-style: none;
}

.zone-level summary:before {
  content: '+';
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  background: #e5f5f2;
  color: #087e89;
  font-weight: 900;
}

.zone-level[open] summary:before {
  content: '−';
}

.zone-level summary strong {
  font-size: 13px;
}

.zone-level summary small {
  margin-left: auto;
  color: #648087;
  font-weight: 700;
}

.zone-level .zone-pieces-scroll {
  max-height: 260px;
  border: 0;
  border-top: 1px solid #d8e9e7;
  border-radius: 0;
}

.zone-pieces-table {
  min-width: 760px;
}

.zone-pieces-table th:nth-child(1) {
  width: 30%;
}

.zone-pieces-table th:nth-child(2) {
  width: 19%;
}

.zone-pieces-table th:nth-child(3) {
  width: 12%;
}

.zone-pieces-table th:nth-child(4) {
  width: 14%;
}

.zone-pieces-table th:nth-child(5) {
  width: 25%;
}

.zone-pieces-head,.zone-level-manage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.zone-pieces-head h4 {
  margin: 0;
}

.zone-level-manage {
  justify-content: flex-end;
  padding: 0 12px 9px;
}

.zone-pieces-table th:last-child.zone-piece-action {
  width: 85px;
}

.zone-pieces-table td.zone-piece-action {
  text-align: right;
}

.zone-remove-btn {
  padding: 6px 9px;
  border: 1px solid #dfb4b4;
  border-radius: 7px;
  background: #fffafa;
  color: #9a3030;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.zone-remove-btn:hover {
  background: #fae9e9;
  border-color: #bc7777;
}

.zone-remove-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.zone-pieces-head .zone-remove-btn {
  flex: 0 0 auto;
}

.zone-detail-stats {
  margin: 11px 0 16px;
}

.zone-stats-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.zone-stats-head small {
  display: block;
  font-weight: 900;
  text-transform: uppercase;
}

.zone-stats-head h4 {
  color: #123d48!important;
}

.zone-stats-head p {
  margin: 0;
  color: #607d83;
}

.zone-stats-total {
  text-align: right;
}

.zone-stats-total strong {
  display: block;
  color: #087e89;
  font-size: 23px;
  font-weight: 950;
  white-space: nowrap;
}

.zone-stats-total span {
  color: #52727a;
  font-size: 10px;
  font-weight: 800;
}

.zone-stat-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
}

.zone-stat-card {
  min-width: 0;
  border: 1px solid #c4e0e0;
  background: #fff;
  overflow: hidden;
}

.zone-stat-card summary {
  display: flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  list-style: none;
}

.zone-stat-card summary::-webkit-details-marker {
  display: none;
}

.zone-stat-card summary:after {
  content: '⌄';
  color: #6b8790;
  font-size: 16px;
  font-weight: 900;
}

.zone-stat-card[open] summary:after {
  transform: rotate(180deg);
}

.zone-stat-icon {
  display: grid;
  place-items: center;
  flex: 0 0 29px;
  font-weight: 900;
}

.zone-stat-label {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.zone-stat-label strong {
  color: #19404b;
}

.zone-stat-label small {
  color: #6b858a;
  font-size: 10px;
  font-weight: 700;
}

.zone-stat-card summary>b {
  margin-left: auto;
  color: #164b55;
  white-space: nowrap;
}

.zone-stat-card[open] {
  border-color: #83c7c7;
  box-shadow: 0 4px 12px rgba(8,93,101,.08);
}

.zone-stat-lines {
  max-height: 210px;
  overflow: auto;
  padding: 0 10px 8px;
  border-top: 1px solid #e0eeee;
}

.zone-stat-line {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid #edf4f4;
  color: #244954;
}

.zone-stat-line:last-child {
  border-bottom: 0;
}

.zone-stat-line span {
  min-width: 0;
}

.zone-stat-line small {
  display: block;
  color: #719097;
  font-size: 9px;
  font-weight: 800;
}

.zone-stat-line strong {
  flex: 0 0 auto;
  color: #087e89;
  white-space: nowrap;
}

.zone-stat-empty {
  padding: 8px 0;
  color: #6b858a;
  font-size: 11px;
}

.zone-categories {
  border: 1px solid #dcebea;
  background: #fff;
  overflow: hidden;
}

.zone-categories-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px solid #e1eded;
  color: #19404b;
}

.zone-categories-head span {
  color: #69858a;
  font-weight: 700;
}

.zone-categories-scroll {
  max-height: 300px;
  overflow: auto;
}

.zone-categories table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.zone-categories th {
  position: sticky;
  top: 0;
  font-size: 10px;
  text-align: left;
  text-transform: uppercase;
}

.zone-categories th:nth-child(n+2),.zone-categories td:nth-child(n+2) {
  text-align: right;
}

.zone-categories td {
  border-top: 1px solid #edf3f3;
  color: #214651;
}

.zone-categories td:first-child {
  font-weight: 800;
}

.zone-categories td:last-child {
  white-space: nowrap;
  font-weight: 900;
}

.zone-category-bar {
  display: block;
  max-width: 100%;
  margin-top: 5px;
  border-radius: 4px;
}

.zone-stats-hint {
  margin: 9px 1px 0!important;
  color: #668188;
  font-size: 10px!important;
}

.zone-stat-label strong {
  font-size: 13px;
}

.zone-stat-line {
  font-size: 12px;
}

.zone-stat-line strong {
  font-size: 12px;
}

@media(max-width:850px) {
  .zone-stat-grid {
    grid-template-columns: 1fr;
  }
  .zone-stat-card summary {
    min-height: 54px;
  }
  .zone-stats-head {
    align-items: flex-start;
  }
  .zone-stats-total strong {
    font-size: 18px;
  }
}

@media(max-width:530px) {
  .zone-stats-head {
    flex-direction: column;
  }
  .zone-stats-total {
    text-align: left;
  }
  .zone-categories td,.zone-categories th {
    padding-left: 8px;
    padding-right: 8px;
  }
}

#zoningDialog .form-actions {
  margin-top: 0;
  padding: 11px 0;
}

@media(max-width:1200px) {
  #zoningDialog .work-form {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}

@media(max-width:900px) {
  #zoningDialog .work-form {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .zone-agent-field {
    grid-column: 1/-1;
  }
}

@media(max-width:600px) {
  #zoningDialog .work-form {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .zone-documents {
    grid-template-columns: 1fr;
  }
  .zone-import-controls input {
    min-width: 100%;
  }
  .zone-agent-choices {
    grid-template-columns: 1fr;
  }
}

/* V3.4.7 — fiche large et lecture immédiate des surfaces hors entretien. */
#zoningDialog .work-form {
  width: 100%;
  max-width: none;
  padding: clamp(16px,2vw,34px) clamp(18px,3vw,58px);
  column-gap: clamp(16px,1.7vw,30px);
}

#zoningDialog .modal-head {
  padding-left: clamp(18px,3vw,58px);
  padding-right: clamp(18px,3vw,58px);
}

#zoningDialog .zone-import,#zoningDialog .zone-documents,#zoningDialog #zonePiecesExisting {
  min-width: 0;
  width: 100%;
}

.zone-detail-stats {
  padding: clamp(14px,1.5vw,26px);
  border: 1px solid #c6e7ea;
  border-radius: 20px;
  background: linear-gradient(145deg,#f0fbfb 0%,#f7faff 58%,#fff 100%);
  box-shadow: 0 14px 34px rgba(11,65,86,.10);
}

.zone-stats-head {
  position: relative;
  overflow: hidden;
  align-items: flex-start;
  margin: -1px -1px 16px;
  padding: 19px 23px;
  border-radius: 15px;
  background: linear-gradient(110deg,#093a55,#087f92 64%,#22b5af);
  color: #fff;
}

.zone-stats-head:after {
  content: '';
  position: absolute;
  right: -42px;
  top: -70px;
  width: 205px;
  height: 205px;
  border: 1px solid #ffffff46;
  border-radius: 50%;
  box-shadow: 0 0 0 24px #ffffff10,0 0 0 52px #ffffff0b;
}

.zone-stats-head small,.zone-stats-head h4,.zone-stats-head p {
  position: relative;
  z-index: 1;
  color: #fff!important;
}

.zone-stats-head small {
  font-size: 10px;
  letter-spacing: .16em;
  color: #bdf9f6!important;
}

.zone-stats-head h4 {
  margin: 4px 0!important;
  font-size: clamp(20px,2vw,27px)!important;
}

.zone-stats-head p {
  font-size: 12px;
  opacity: .85;
}

.zone-stats-head-mark {
  position: relative;
  z-index: 1;
  margin: 2px 2px 0 16px;
  padding: 8px 12px;
  border: 1px solid #ffffff82;
  border-radius: 12px;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.zone-summary-metrics {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr;
  gap: 12px;
  margin-bottom: 17px;
}

.zone-summary-metric {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 116px;
  padding: 17px 19px;
  border: 1px solid #dbe7ee;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 5px 13px #093a550d;
}

.zone-summary-metric:before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  border-radius: 15px 0 0 15px;
  background: #26b3ac;
}

.zone-summary-metric span {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.zone-summary-metric strong {
  margin-top: 7px;
  font-size: clamp(23px,2.7vw,34px);
  font-weight: 950;
  line-height: 1.05;
  white-space: nowrap;
}

.zone-summary-metric strong small {
  font-size: 14px;
  font-weight: 800;
}

.zone-summary-metric em {
  margin-top: auto;
  padding-top: 5px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  opacity: .75;
}

.zone-summary-metric.is-clean {
  border-color: #087f92;
  background: linear-gradient(135deg,#075a70,#078d91);
  color: #fff;
}

.zone-summary-metric.is-clean:before {
  background: #77f0d7;
}

.zone-summary-metric.is-excluded {
  border-color: #f3b4b2;
  background: linear-gradient(145deg,#fff5f2,#ffe6e4);
  color: #a43f49;
}

.zone-summary-metric.is-excluded:before {
  background: #ee646c;
}

.zone-summary-metric.is-recorded {
  background: linear-gradient(145deg,#fff,#edf3fb);
  color: #304c69;
}

.zone-summary-metric.is-recorded:before {
  background: #8195bc;
}

.zone-excluded-block {
  margin-bottom: 17px;
  padding: 15px;
  border: 1px solid #f1c5c2;
  border-radius: 14px;
  background: #fff8f6;
}

.zone-excluded-head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 5px 12px;
  margin-bottom: 10px;
  color: #a23e49;
}

.zone-excluded-head strong {
  font-size: 14px;
}

.zone-excluded-head span {
  font-size: 11px;
  font-weight: 700;
  color: #9a6870;
}

.zone-excluded-list {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap: 7px;
  max-height: 190px;
  overflow: auto;
}

.zone-excluded-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
  border: 1px solid #f3d5d1;
  border-radius: 9px;
  background: #fff;
  color: #783c45;
}

.zone-excluded-item span {
  min-width: 0;
}

.zone-excluded-item strong {
  display: block;
  font-size: 11px;
}

.zone-excluded-item small {
  display: block;
  margin-top: 2px;
  color: #9c6870;
  font-size: 10px;
}

.zone-excluded-item b {
  white-space: nowrap;
  font-size: 11px;
}

.zone-stat-grid {
  gap: 12px;
}

.zone-stat-card {
  border-radius: 13px;
  border-color: #cfdfe8;
  box-shadow: 0 4px 12px #093a550d;
}

.zone-stat-card summary {
  min-height: 77px;
  padding: 13px;
}

.zone-stat-card summary>b {
  font-size: 16px;
}

.zone-stat-icon {
  width: 38px;
  height: 38px;
  flex-basis: 38px;
  border-radius: 11px;
  background: #dce7ff;
  color: #3b55ad;
  font-size: 12px;
}

.zone-stat-card.sanitaires .zone-stat-icon {
  background: #d4f5f0;
  color: #087f7b;
}

.zone-stat-card.escaliers .zone-stat-icon {
  background: #ffead0;
  color: #a35c18;
}

.zone-categories {
  margin-top: 17px;
  border-radius: 13px;
  border-color: #d2e2e9;
}

.zone-categories-head {
  padding: 13px 16px;
  background: #f7fbff;
  font-size: 13px;
}

.zone-categories th {
  padding: 10px 13px;
  background: #eaf4f8;
  color: #43647b;
}

.zone-categories td {
  padding: 10px 13px;
}

.zone-categories td:first-child {
  width: auto;
}

.zone-categories .zone-category-excluded {
  background: #fff4f2;
  color: #9b4650;
}

.zone-categories .zone-category-excluded td {
  color: #8e4851;
}

.zone-categories td:last-child {
  color: #b34a53;
}

.zone-category-bar {
  height: 4px;
  background: #19afa8;
}

.zone-piece-excluded {
  background: #fff2f1!important;
}

.zone-piece-excluded td {
  color: #8d5158!important;
}

.zone-piece-excluded td:first-child strong {
  text-decoration: none;
}

.zone-excluded-pill {
  display: inline-flex;
  margin-left: 8px;
  padding: 3px 7px;
  border-radius: 99px;
  background: #e86068;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
  vertical-align: middle;
}

.zone-import-summary .zone-import-surface {
  background: #d9f6ec;
  color: #086c60;
  border: 1px solid #82d8bb;
  font-weight: 900;
}

.zone-level summary small {
  white-space: normal;
  text-align: right;
  line-height: 1.5;
}

.zone-level summary small b {
  color: #087f86;
}

.zone-level summary small em {
  color: #b64c57;
  font-style: normal;
  font-weight: 900;
}

@media(max-width:900px) {
  .zone-summary-metrics {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .zone-summary-metric.is-clean {
    grid-column: 1/-1;
  }
}

@media(max-width:600px) {
  #zoningDialog .work-form {
    padding: 15px 14px;
  }
  #zoningDialog .modal-head {
    padding-left: 14px;
    padding-right: 14px;
  }
  .zone-detail-stats {
    padding: 11px;
  }
  .zone-stats-head {
    padding: 17px;
  }
  .zone-summary-metrics {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .zone-summary-metric,.zone-summary-metric.is-clean {
    grid-column: 1;
    min-height: 95px;
  }
  .zone-stat-card summary {
    min-height: 62px;
  }
  .zone-level summary {
    align-items: flex-start;
  }
  .zone-level summary small {
    font-size: 10px;
  }
  .zone-excluded-list {
    grid-template-columns: 1fr;
  }
}

/* V3.4.9 — cinq campus alignés avec leurs tuiles de zone complètes. */
.zoning-campus-list {
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 8px;
}

.zoning-campus-list .zoning-campus.zoning-campus-micro {
  grid-column: auto;
  min-width: 0;
}

.zoning-campus-micro .zoning-campus-head {
  align-items: flex-start;
  flex-direction: column;
  gap: 3px;
  padding: 11px 12px;
}

.zoning-campus-micro .zoning-campus-head h3 {
  font-size: clamp(12px,1vw,15px);
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.zoning-campus-micro .zoning-campus-head small {
  font-size: 10px;
}

.zoning-campus-micro .zoning-grid,.zoning-campus-micro.compact .zoning-grid {
  grid-template-columns: minmax(0,1fr);
  gap: 7px;
  padding: 8px;
}

.zoning-campus-micro .zoning-zone {
  min-width: 0;
}

@media(max-width:1450px) {
  .zoning-campus-list {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}

@media(max-width:850px) {
  .zoning-campus-list {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media(max-width:600px) {
  .zoning-campus-list {
    grid-template-columns: 1fr;
  }
}

/* V3.5.0 — zone mixte et choix exclusif de l’intervenant par pièce. */
.zoning-zone.mixte {
  border-left-color: #8055b8;
  background: #fbf8ff;
}

.zoning-badge.mixte {
  background: #eee5ff;
  color: #67419b;
}

.zoning-market.mixte {
  background: #eee5ff;
  color: #67419b;
}

.zoning-mixed-split {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}

.zoning-mixed-split span {
  padding: 4px 7px;
  border-radius: 7px;
  background: #e6f7ed;
  color: #146746;
  font-size: 10px;
  font-weight: 850;
}

.zoning-mixed-split span.company {
  background: #e8efff;
  color: #315cb1;
}

.zoning-mixed-split span.pending {
  background: #fff0d7;
  color: #935a11;
}

.zone-mixed-panel {
  margin: 16px 0;
  padding: clamp(13px,1.4vw,20px);
  border: 1px solid #baa5dd;
  border-radius: 16px;
  background: linear-gradient(140deg,#fbf8ff,#f4f9ff);
  box-shadow: 0 8px 22px #58368112;
}

.zone-mixed-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 15px;
  margin-bottom: 12px;
}

.zone-mixed-head small {
  color: #764aac;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.zone-mixed-head h4 {
  margin: 3px 0!important;
  color: #4b3173!important;
  font-size: 18px!important;
}

.zone-mixed-head p {
  margin: 0!important;
  color: #66557a;
  font-size: 12px!important;
}

.zone-mixed-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.zone-mixed-summary span {
  padding: 7px 9px;
  border-radius: 9px;
  background: #fff;
  color: #514765;
  font-size: 11px;
  font-weight: 800;
}

.zone-mixed-summary b {
  color: #5b3b86;
}

.zone-mixed-list {
  display: grid;
  gap: 6px;
  max-height: 440px;
  overflow: auto;
}

.zone-mixed-level {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
  padding: 7px 9px;
  border-radius: 8px;
  background: #e9dff8;
  color: #513477;
  font-size: 12px;
}

.zone-mixed-level span {
  font-size: 10px;
  font-weight: 800;
}

.zone-mixed-piece {
  display: grid;
  grid-template-columns: minmax(0,1fr) 95px 100px 100px;
  gap: 10px;
  align-items: center;
  padding: 9px 11px;
  border: 1px solid #e2d7ef;
  border-radius: 9px;
  background: #fff;
}

.zone-mixed-piece-name {
  min-width: 0;
}

.zone-mixed-piece-name b {
  display: block;
  color: #273f51;
  font-size: 12px;
}

.zone-mixed-piece-name small {
  display: block;
  color: #6b7f87;
  font-size: 10px;
}

.zone-mixed-area {
  color: #087e89;
  font-size: 12px;
  text-align: right;
}

.zone-mixed-piece label {
  display: flex;
  align-items: center;
  gap: 5px;
  justify-content: center;
  padding: 6px;
  border: 1px solid #d8e4e9;
  border-radius: 8px;
  color: #405c66;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}

.zone-mixed-piece label:has(input:checked) {
  border-color: #36a98f;
  background: #e4f7ed;
  color: #146746;
}

.zone-mixed-piece label:last-child:has(input:checked) {
  border-color: #6586d4;
  background: #e8efff;
  color: #315cb1;
}

.zone-mixed-piece input {
  width: 15px;
  height: 15px;
  accent-color: #11806b;
}

@media(max-width:650px) {
  .zone-mixed-piece {
    grid-template-columns: minmax(0,1fr) auto;
  }
  .zone-mixed-piece label {
    grid-row: 2;
  }
  .zone-mixed-piece label:nth-last-child(2) {
    grid-column: 1;
  }
  .zone-mixed-piece label:last-child {
    grid-column: 2;
  }
  .zone-mixed-area {
    text-align: right;
  }
}

/* Couleurs franches et différenciées : vert interne, bleu initial, violet complémentaire, rose mixte. */
.zoning-zone.interne,.zoning-zone.interne:hover {
  border-left: 7px solid #078653;
  background: #ebfff4;
}

.zoning-zone.entreprise-initiale,.zoning-zone.entreprise-initiale:hover {
  border-left: 7px solid #255ce1;
  background: #ecf2ff;
}

.zoning-zone.entreprise-complementaire,.zoning-zone.entreprise-complementaire:hover {
  border-left: 7px solid #8238bd;
  background: #f6eaff;
}

.zoning-zone.mixte,.zoning-zone.mixte:hover {
  border-left: 7px solid #ac206f;
  background: #fff0f8;
}

.zoning-badge.interne,.zoning-market.interne {
  background: #087748;
  color: #fff;
}

.zoning-badge.entreprise-initiale,.zoning-market.entreprise-initiale {
  background: #2459cd;
  color: #fff;
}

.zoning-badge.entreprise-complementaire,.zoning-market.entreprise-complementaire {
  background: #7534ac;
  color: #fff;
}

.zoning-badge.mixte,.zoning-market.mixte {
  background: #ac206f;
  color: #fff;
}

.zoning-zone.remplacement,.zoning-zone.remplacement:hover {
  border-left: 7px solid #d97706;
  background: #fff8e9;
}

.zoning-zone.absent,.zoning-zone.absent:hover {
  border-left: 7px solid #c23636!important;
  background: #fff0f0;
}

/* V3.5.4 — accès direct aux plans depuis les tuiles. */
.zoning-plan-eye {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 27px;
  height: 27px;
  padding: 0;
  border: 1px solid #a88bcc;
  border-radius: 50%;
  background: #f2eaff;
  color: #633b92;
  cursor: pointer;
}

.zoning-plan-eye:hover,.zoning-plan-eye:focus-visible {
  border-color: #633b92;
  background: #633b92;
  color: #fff;
  outline: 2px solid #633b9255;
  outline-offset: 2px;
}

.zoning-plan-eye svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#zonePlansViewer {
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #eef4f5;
  color: #203f4a;
}

#zonePlansViewer::backdrop {
  background: #082d3cc9;
}

.zone-plans-viewer {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.zone-plans-viewer-head {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 10px clamp(14px,2vw,28px);
  background: #075f68;
  color: #fff;
}

.zone-plans-viewer-head strong {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 15px;
}

.zone-plans-viewer-head button,.zone-plans-viewer-head a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #fff;
  border-radius: 8px;
  background: #fff;
  color: #075f68;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}

.zone-plans-viewer-head [hidden] {
  display: none;
}

.zone-plans-viewer-body {
  display: grid;
  grid-template-columns: minmax(170px,220px) minmax(0,1fr);
  flex: 1;
  min-height: 0;
}

.zone-plans-viewer-list {
  display: grid;
  align-content: start;
  gap: 7px;
  overflow: auto;
  padding: 13px;
  border-right: 1px solid #c5dadd;
  background: #f8fcfc;
}

.zone-plans-viewer-list button {
  width: 100%;
  padding: 10px 11px;
  border: 1px solid #c9dcde;
  border-radius: 9px;
  background: #fff;
  color: #285260;
  font-size: 12px;
  font-weight: 800;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
}

.zone-plans-viewer-list button.active {
  border-color: #087e89;
  background: #ddf4f1;
  color: #075f68;
}

.zone-plans-viewer-content {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: 12px;
}

.zone-plans-viewer-content iframe,.zone-plans-viewer-content img {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

.zone-plans-viewer-content img {
  object-fit: contain;
}

.zone-plans-viewer-message {
  max-width: 560px;
  padding: 24px;
  border: 1px solid #d0e2e4;
  border-radius: 14px;
  background: #fff;
  color: #476b73;
  text-align: center;
  font-size: 14px;
}

@media(max-width:650px) {
  .zone-plans-viewer-body {
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0,1fr);
  }
  .zone-plans-viewer-list {
    display: flex;
    max-height: 90px;
    border-right: 0;
    border-bottom: 1px solid #c5dadd;
  }
  .zone-plans-viewer-list button {
    flex: 0 0 auto;
    max-width: 170px;
  }
  .zone-plans-viewer-head strong {
    font-size: 12px;
  }
}

/* V3.5.5 — actions de complétude du zoning sur le tableau de bord. */
.dash-zoning-note {
  margin: 12px 16px 0;
  color: #5b7980;
  font-size: 12px;
}

.dash-zoning-summary {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 12px 16px 0;
}

.dash-zoning-summary span {
  padding: 7px 10px;
  border-radius: 999px;
  background: #fff0f7;
  color: #8d255f;
  font-size: 11px;
  font-weight: 900;
}

.dash-zoning-summary span.docs {
  background: #eaf2ff;
  color: #2851a0;
}

.dash-zoning-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 13px;
  padding: 15px 16px 17px;
}

.dash-zoning-group {
  min-width: 0;
  border: 1px solid #d7e6e8;
  border-radius: 13px;
  background: #f9fcfc;
  overflow: hidden;
}

.dash-zoning-group h4 {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  padding: 12px 13px;
  background: #fff0f7;
  color: #772451;
  font-size: 13px;
}

.dash-zoning-group.docs h4 {
  background: #eaf2ff;
  color: #234c98;
}

.dash-zoning-group h4 span {
  display: grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: #fff;
  font-size: 11px;
}

.dash-zoning-list {
  display: grid;
  align-content: start;
  gap: 6px;
  max-height: 355px;
  overflow: auto;
  padding: 9px;
}

.dash-zoning-item {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid #e1e9ea;
  border-left: 4px solid #ac206f;
  border-radius: 9px;
  background: #fff;
  color: #203f4a;
  text-align: left;
  cursor: pointer;
}

/* V3.6.0 — demandes de prestation en deux étapes. */
.replacement-workflow {
  display: grid;
  margin-top: 18px;
}

[data-replacement-signature][hidden] {
  display: none!important;
}

/* V3.6.2 — parcours de remplacement plus lisible et pièces jointes mises en avant. */
.replacement-workflow {
  grid-template-columns: minmax(300px,370px) minmax(0,1fr);
  gap: 18px;
  align-items: start;
}

.replacement-workflow>.panel {
  min-width: 0;
  border-radius: 17px;
  padding: 20px;
}

.replacement-workflow>.panel:first-child {
  background: #f7fbfb;
}

.replacement-panel-title p {
  line-height: 1.45;
}

.replacement-zone-choice strong {
  line-height: 1.3;
}

.replacement-zone-choice small {
  line-height: 1.4;
}

.replacement-zone-choice .replacement-area {
  grid-column: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #087e89;
  font-size: 11px;
  font-weight: 900;
}

.replacement-zone-choice input[type=number] {
  height: 32px;
  text-align: right;
}

.replacement-zone-choice input[type=checkbox] {
  align-self: start;
  margin-top: 2px;
}

.replacement-tabs button {
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  border-width: 2px;
}

.replacement-tabs button .step-number {
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: #e7f5f4;
  color: #087e89;
  font-size: 16px;
}

.replacement-tabs button.active .step-number {
  background: #fff;
  color: #087e89;
}

.replacement-tabs button strong,.replacement-tabs button small {
  display: block;
}

.replacement-tabs button strong {
  font-size: 13px;
}

.replacement-tabs button small {
  margin-top: 3px;
  font-size: 10px;
  font-weight: 600;
  opacity: .85;
}

.replacement-stage-heading {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 0 0 14px;
  padding: 11px 13px;
  border-radius: 10px;
  background: #eaf6f5;
  color: #075f68;
}

.replacement-stage-heading strong {
  font-size: 13px;
}

.replacement-stage-heading small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: #436d74;
}

.replacement-attachment {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 6px 0;
  padding: 17px;
  border: 2px dashed #50b9bb;
  border-radius: 14px;
  background: linear-gradient(135deg,#eefaf8,#f9fefe);
}

.replacement-attachment.needs-file {
  border-color: #e2a157;
  background: linear-gradient(135deg,#fff7eb,#fffdf9);
}

.replacement-attachment.has-file {
  border-style: solid;
  border-color: #27aa87;
  background: #effaf5;
}

.replacement-attachment-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.replacement-attachment-icon {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #d3efed;
  color: #087e89;
  font-size: 20px;
}

.replacement-attachment.needs-file .replacement-attachment-icon {
  background: #ffead1;
  color: #a25817;
}

.replacement-attachment-title strong {
  display: block;
  color: #145761;
  font-size: 14px;
}

.replacement-attachment-title small {
  display: block;
  margin-top: 4px;
  color: #5d7b81;
  font-size: 11px;
  line-height: 1.35;
}

.replacement-file-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 39px;
  padding: 9px 14px;
  border-radius: 9px;
  background: #087e89;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.replacement-file-button:hover {
  background: #075f68;
}

.replacement-file-button:focus-within {
  outline: 3px solid #087e8970;
  outline-offset: 2px;
}

.replacement-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
}

.replacement-file-list {
  grid-column: 1/-1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 24px;
}

.replacement-file-list span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border-radius: 7px;
  background: #fff;
  border: 1px solid #cfe4e4;
  color: #315b63;
  font-size: 11px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.replacement-file-list .missing {
  border-color: #f0d2a8;
  background: #fff9ef;
  color: #9b5b1f;
}

.replacement-alerts {
  margin: 12px 0 0;
  border: 1px solid #f1c9ca;
  border-radius: 11px;
  background: #fff8f8;
  overflow: hidden;
}

.replacement-alerts summary {
  padding: 11px 14px;
  color: #a8383e;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.replacement-alerts .replacement-list {
  padding: 10px;
}

.replacement-mail-actions button {
  font-size: 13px;
}

@media(max-width:970px) {
  .replacement-workflow {
    grid-template-columns: 1fr;
  }
  .replacement-zone-choices {
    max-height: 320px;
  }
  .replacement-zone-choice {
    grid-template-columns: 18px minmax(0,1fr) auto;
  }
  .replacement-zone-choice .replacement-area {
    grid-column: 3;
    grid-row: 1/3;
    align-self: center;
  }
}

@media(max-width:620px) {
  .replacement-zone-choice {
    grid-template-columns: 18px minmax(0,1fr);
  }
  .replacement-zone-choice .replacement-area {
    grid-column: 2;
    grid-row: auto;
  }
  .replacement-tabs {
    flex-direction: column;
  }
  .replacement-attachment {
    grid-template-columns: 1fr;
  }
  .replacement-file-button {
    justify-self: start;
  }
}

.replacement-workflow .panel {
  padding: 18px;
}

.replacement-panel-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.replacement-panel-title h3 {
  margin: 0;
  color: #075f68;
  font-size: 17px;
}

.replacement-panel-title p {
  margin: 4px 0 0;
  color: #5b7980;
  font-size: 12px;
}

.replacement-panel-title .count {
  background: #087e89;
}

.replacement-filters,.replacement-form-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
}

.replacement-filters label,.replacement-form-grid label {
  display: grid;
  gap: 5px;
  color: #496d75;
  font-size: 11px;
  font-weight: 800;
}

.replacement-filters input,.replacement-filters select,.replacement-form-grid input,.replacement-form-grid select,.replacement-form-grid textarea,.replacement-mail-recipients input {
  width: 100%;
  min-width: 0;
  padding: 10px;
  border: 1px solid #c5dadd;
  border-radius: 9px;
  background: #fff;
  color: #183f49;
  font: inherit;
  font-size: 12px;
}

.replacement-form-grid .wide {
  grid-column: 1/-1;
}

.replacement-form-grid textarea {
  min-height: 66px;
  resize: vertical;
}

.replacement-zone-choices {
  display: grid;
  gap: 8px;
  max-height: 440px;
  overflow: auto;
  margin-top: 12px;
}

.replacement-zone-choice {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) 90px;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid #d7e6e8;
  border-radius: 11px;
  background: #f9fcfc;
}

.replacement-zone-choice.selected {
  border-color: #13a9ae;
  background: #eaf8f6;
}

.replacement-zone-choice.absent {
  border-left: 4px solid #dc595f;
}

.replacement-zone-choice.present {
  border-left: 4px solid #26a57b;
}

.replacement-zone-choice strong,.replacement-zone-choice small {
  display: block;
}

.replacement-zone-choice strong {
  font-size: 12px;
  color: #163e48;
}

.replacement-zone-choice small {
  margin-top: 3px;
  font-size: 10px;
  color: #587781;
}

.replacement-zone-choice input[type=number] {
  width: 90px;
  padding: 7px;
  border: 1px solid #b9d9dc;
  border-radius: 8px;
  background: #fff;
  color: #16434a;
  font-size: 12px;
}

.replacement-zone-choice input[type=checkbox] {
  width: 17px;
  height: 17px;
  accent-color: #087e89;
}

.replacement-zone-choice em {
  font-style: normal;
  font-weight: 900;
  color: #087e89;
}

.replacement-tabs {
  display: flex;
  gap: 7px;
  margin: 12px 0;
}

.replacement-tabs button {
  flex: 1;
  padding: 10px;
  border: 1px solid #bcdadd;
  border-radius: 9px;
  background: #fff;
  color: #215965;
  font-weight: 900;
  cursor: pointer;
}

.replacement-tabs button.active {
  background: #087e89;
  color: #fff;
  border-color: #087e89;
}

.replacement-mail-recipients {
  display: grid;
  gap: 8px;
  margin: 12px 0;
}

.replacement-mail-recipients label {
  display: grid;
  gap: 4px;
  color: #496d75;
  font-size: 11px;
  font-weight: 800;
}

.replacement-mail-preview {
  margin-top: 12px;
  border: 1px solid #c9e0e1;
  border-radius: 12px;
  overflow: hidden;
}

.replacement-mail-preview header {
  padding: 9px 12px;
  background: #e7f5f4;
  color: #075f68;
  font-size: 12px;
  font-weight: 900;
}

.replacement-mail-preview pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 330px;
  overflow: auto;
  margin: 0;
  padding: 13px;
  background: #fff;
  color: #2e4b53;
  font: 12px/1.55 Arial,sans-serif;
}

.replacement-mail-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
}

.replacement-mail-actions button {
  padding: 10px 15px;
  border: 0;
  border-radius: 9px;
  background: #087e89;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.replacement-mail-actions small,.replacement-mail-status {
  color: #587781;
  font-size: 11px;
}

.replacement-mail-status.error {
  color: #a8383e;
}

.replacement-empty {
  padding: 16px;
  color: #607c83;
  text-align: center;
  font-size: 12px;
}

@media(max-width:900px) {
  .replacement-workflow {
    grid-template-columns: 1fr;
  }
}

@media(max-width:570px) {
  .replacement-filters,.replacement-form-grid {
    grid-template-columns: 1fr;
  }
  .replacement-form-grid .wide {
    grid-column: auto;
  }
  .replacement-zone-choice {
    grid-template-columns: auto minmax(0,1fr);
  }
  .replacement-zone-choice input[type=number] {
    grid-column: 2;
    width: 100%;
  }
}

.dash-zoning-group.docs .dash-zoning-item {
  border-left-color: #315ec4;
}

#remplacement .replacement-workflow {
  grid-template-columns: minmax(300px,370px) minmax(0,1fr);
  gap: 18px;
}

#remplacement .replacement-workflow>.panel {
  padding: 20px;
}

#remplacement .replacement-zone-choice {
  grid-template-columns: 18px minmax(0,1fr);
  gap: 6px 9px;
  padding: 10px 11px;
}

#remplacement .replacement-zone-choice input[type=number] {
  width: 82px;
  height: 32px;
}

#remplacement .replacement-tabs {
  gap: 10px;
  margin: 13px 0 17px;
}

#remplacement .replacement-tabs button {
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  padding: 13px 14px;
  border-width: 2px;
  border-radius: 12px;
}

#remplacement .replacement-file-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

#remplacement .replacement-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  opacity: 0;
  overflow: hidden;
}

/* V3.6.3 — plans PDF des zones sélectionnées, aperçus et ajoutés au mail initial. */
.replacement-mail-preview .replacement-plan-gallery {
  padding: 13px;
  border-top: 1px solid #d8e7e8;
  background: #f8fcfc;
}

#replacementPlanGallery[hidden] {
  display: none!important;
}

.replacement-plan-gallery {
  grid-column: 1/-1;
  display: grid;
  gap: 9px;
}

.replacement-plan-summary {
  margin: 0;
  color: #356871;
  font-size: 12px;
  font-weight: 900;
}

.replacement-plan-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
  gap: 9px;
}

.replacement-plan-card {
  overflow: hidden;
  border: 1px solid #cfe3e4;
  border-radius: 10px;
  background: #fff;
}

.replacement-plan-card img {
  display: block;
  width: 100%;
  height: 145px;
  object-fit: contain;
  background: #edf4f5;
}

.replacement-plan-card .loading {
  display: grid;
  place-items: center;
  height: 145px;
  padding: 10px;
  background: #edf4f5;
  color: #5f7e85;
  font-size: 11px;
  text-align: center;
}

.replacement-plan-card div:last-child {
  padding: 9px;
}

.replacement-plan-card strong,.replacement-plan-card small {
  display: block;
  overflow-wrap: anywhere;
}

.replacement-plan-card strong {
  font-size: 11px;
  color: #1b525d;
}

.replacement-plan-card small {
  margin-top: 3px;
  font-size: 10px;
  color: #53757b;
}

.replacement-plan-warning {
  padding: 10px 12px;
  border: 1px solid #efd29e;
  border-radius: 9px;
  background: #fff8e9;
  color: #865c20;
  font-size: 11px;
  line-height: 1.45;
}

@media(max-width:970px) {
  #remplacement .replacement-workflow {
    grid-template-columns: 1fr;
  }
  #remplacement .replacement-zone-choice {
    grid-template-columns: 18px minmax(0,1fr) auto;
  }
}

@media(max-width:620px) {
  #remplacement .replacement-zone-choice {
    grid-template-columns: 18px minmax(0,1fr);
  }
}

.dash-zoning-item:hover,.dash-zoning-item:focus-visible {
  border-color: #087e89;
  background: #f0fbfa;
  outline: 2px solid #087e8955;
  outline-offset: 1px;
}

.dash-zoning-item strong,.dash-zoning-item small {
  display: block;
  overflow-wrap: anywhere;
}

.dash-zoning-item strong {
  font-size: 12px;
}

.dash-zoning-item small {
  margin-top: 3px;
  color: #59757d;
  font-size: 11px;
}

.dash-zoning-item em {
  color: #087e89;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.dash-zoning-empty {
  margin: 0;
  padding: 16px;
  color: #5b7980;
  font-size: 12px;
}

@media(max-width:780px) {
  .dash-zoning-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== agent-attributions-v340 ===== */
#agents .hero {
  margin-bottom: 14px;
}

#agents .hero .ghost {
  flex: 0 0 auto;
  border-color: #ffffff85;
  background: #ffffffeb;
  color: #075f68;
  font-weight: 800;
}

.agent-filters {
  display: flex;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
  padding: 13px 16px;
}

.agent-filters label {
  display: grid;
  gap: 5px;
  min-width: 220px;
  flex: 1;
  color: #52747b;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-filters select,.agent-filters input {
  width: 100%;
  height: 40px;
  padding: 8px 11px;
  border: 1px solid #b9dedb;
  border-radius: 9px;
  background: #fbffff;
  color: #203f4a;
  font-size: 13px;
  text-transform: none;
}

.agent-connection {
  align-self: center;
  color: #648087;
  font-size: 11px;
  font-weight: 700;
}

.agent-layout {
  display: grid;
  grid-template-columns: minmax(240px,290px) minmax(0,1fr);
  gap: 16px;
  align-items: start;
}

.agent-sidebar {
  padding: 0;
  overflow: hidden;
}

.agent-sidebar-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  border-bottom: 1px solid #d7e8e7;
}

.agent-sidebar-title h3 {
  margin: 0;
  color: #075f68;
  font-size: 16px;
}

.agent-sidebar-title span {
  display: grid;
  place-items: center;
  min-width: 25px;
  height: 25px;
  padding: 0 6px;
  border-radius: 50px;
  background: #dff2f0;
  color: #087e89;
  font-size: 11px;
  font-weight: 900;
}

.agent-list {
  display: grid;
  gap: 5px;
  max-height: calc(100dvh - 250px);
  min-height: 160px;
  overflow: auto;
  padding: 9px;
}

.agent-list button {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 9px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #203f4a;
  text-align: left;
}

.agent-list button:hover {
  background: #eff9f8;
}

.agent-list button.is-selected {
  border-color: #8dcac7;
  background: #e5f5f3;
  box-shadow: inset 3px 0 #087e89;
}

.agent-avatar {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: #d7eeeb;
  color: #087e89;
  font-size: 12px;
  font-weight: 900;
}

.agent-list button strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.agent-list button small {
  display: block;
  color: #648087;
  font-size: 10px;
}

.agent-list button em {
  color: #087e89;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.agent-detail-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 19px 20px;
}

.agent-detail-head h3 {
  margin: 0;
  color: #075f68;
  font-size: 21px;
}

.agent-detail-head p {
  margin: 3px 0 0;
  color: #638087;
  font-size: 12px;
}

.agent-detail-head .action-main {
  padding: 10px 15px;
  box-shadow: none;
}

.agent-detail-head .action-main:disabled {
  opacity: .45;
  cursor: not-allowed;
  transform: none;
}

.agent-kpis {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 9px;
  margin: 0 20px 16px;
}

.agent-kpis div {
  padding: 12px;
  border: 1px solid #c9e4e1;
  border-radius: 10px;
  background: #f4fbfa;
}

.agent-kpis small {
  display: block;
  color: #618087;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.agent-kpis strong {
  display: block;
  margin-top: 3px;
  color: #087e89;
  font-size: 20px;
}

.agent-status {
  margin: 0 20px 14px;
  color: #476d72;
  font-size: 12px;
}

.agent-status.error {
  color: #a32929;
}

.agent-zones {
  display: grid;
  gap: 12px;
  padding: 0 20px 20px;
}

.agent-zone {
  border: 1px solid #c9e3e1;
  border-radius: 13px;
  background: #fff;
  overflow: hidden;
}

.agent-zone-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  background: #f1faf9;
}

.agent-zone-head small {
  display: block;
  margin-bottom: 3px;
  color: #5c7d82;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-zone-head h4 {
  margin: 0;
  color: #075f68;
  font-size: 15px;
}

.agent-zone-head strong {
  color: #087e89;
  font-size: 13px;
  white-space: nowrap;
}

.agent-zone-stats {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 9px 16px;
  border-top: 1px solid #e1eeec;
}

.agent-zone-stats span {
  padding: 4px 7px;
  border-radius: 6px;
  background: #e9f6f3;
  color: #176a63;
  font-size: 10px;
  font-weight: 800;
}

.agent-level {
  margin: 0 16px 12px;
  border: 1px solid #e0ecea;
  border-radius: 9px;
  overflow: hidden;
}

.agent-level summary {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 11px;
  background: #fafdfc;
  color: #24545b;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.agent-level summary small {
  font-weight: 700;
  color: #648087;
}

.agent-piece-list {
  display: grid;
}

.agent-piece {
  display: grid;
  grid-template-columns: 17px minmax(0,1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 41px;
  padding: 7px 11px;
  border-top: 1px solid #edf3f2;
  cursor: pointer;
}

.agent-piece:hover {
  background: #f8fcfb;
}

.agent-piece input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: #087e89;
}

.agent-piece strong {
  display: block;
  color: #26464d;
  font-size: 11px;
}

.agent-piece small {
  display: block;
  color: #688187;
  font-size: 10px;
}

.agent-piece em {
  color: #087e89;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.agent-piece.is-other {
  background: #f7f8f8;
  color: #7b898b;
  cursor: not-allowed;
}

.agent-piece.is-other em {
  color: #78898c;
}

.agent-empty {
  padding: 22px;
  border: 1px dashed #bedbd8;
  border-radius: 11px;
  background: #f8fcfb;
  color: #52777d;
  font-size: 12px;
}

.agent-main>.panel {
  padding: 0;
}

.agent-piece.is-shared {
  background: #fffaf0;
}

.agent-piece.is-shared:hover {
  background: #fff3d9;
}

.agent-piece.is-shared small {
  color: #896119;
}

.agent-piece.is-shared em {
  color: #805500;
}

@media(max-width:850px) {
  .agent-layout {
    grid-template-columns: 1fr;
  }
  .agent-list {
    display: flex;
    min-height: 0;
    max-height: none;
    overflow-x: auto;
  }
  .agent-list button {
    min-width: 190px;
    max-width: 245px;
  }
  .agent-filters label {
    min-width: 160px;
  }
}

@media(max-width:560px) {
  .agent-detail-head {
    flex-wrap: wrap;
  }
  .agent-kpis {
    grid-template-columns: 1fr;
  }
  .agent-zone-head {
    flex-wrap: wrap;
  }
}