/* ZonageCP — tokens et base communs (charte issue du design validé) */

:root {
  /* Encres */
  --encre: #2c3b4d;
  --texte-2: #5f7186;
  --texte-3: #93a5b9;

  /* Marque */
  --ardoise: #4a7099;
  --ardoise-fonce: #35526f;
  --bleu: #1f5ed4;
  --rouge: #c33b32;

  /* Carte */
  --gris-nc: #9fb0c2;
  --orange-dept: #e08c2a;

  /* Surfaces */
  --fond: #eef3f8;
  --fond-doux: #f7fafd;
  --panneau: #ffffff;
  --panneau-entete: #eaf2f9;
  --carte-fond: #dde4ea;

  /* Bords */
  --bord: #dde6ef;
  --bord-fort: #cfdcea;
  --ligne: #e9f0f7;

  /* Chips */
  --chip-bg: #f5f9fc;
  --chip-fg: #3f5266;

  /* Conflits (ambre) */
  --ambre-bg: #fdf6e8;
  --ambre-bord: #ecd6a8;
  --ambre-fg: #7d5010;
  --ambre-chip: #f9ecd2;
  --ambre-ligne: #f6ead2;
  --ambre-texte-2: #a07b3c;

  /* Typo */
  --sans: 'Plus Jakarta Sans', Helvetica, Arial, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Ombres */
  --ombre-carte: 0 4px 16px rgba(40, 55, 60, 0.10);
  --ombre-bloc: 0 14px 36px rgba(40, 55, 60, 0.11);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--fond);
  color: var(--encre);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--ardoise); text-decoration: none; }
a:hover { color: var(--ardoise-fonce); text-decoration: underline; }

/* ---- Logo (pin bleu dans un cadre pointillé, point rouge « dehors ») ---- */
/* Taille pilotée par font-size : .zc-logo { font-size: 30px } => cadre 1em. */
.zc-logo {
  position: relative;
  width: 1em;
  height: 1em;
  flex: none;
  border: 0.045em dashed var(--ardoise);
  border-radius: 0.22em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.zc-logo .pin {
  width: 0.36em;
  height: 0.36em;
  flex: none;
  border-radius: 50% 50% 50% 0.03em;
  transform: rotate(-45deg);
  background: var(--bleu);
  display: flex;
  align-items: center;
  justify-content: center;
}
.zc-logo .pin::after {
  content: '';
  width: 0.13em;
  height: 0.13em;
  border-radius: 50%;
  background: #ffffff;
}
.zc-logo .dehors {
  position: absolute;
  right: -0.1em;
  bottom: -0.1em;
  width: 0.22em;
  height: 0.22em;
  border-radius: 50%;
  background: var(--rouge);
  box-shadow: 0 0 0 0.035em #ffffff;
}
/* Version négatif (sur fond ardoise foncé) */
.zc-logo.negatif { border-color: #9fb8d0; }
.zc-logo.negatif .pin { background: #6fa0e0; }
.zc-logo.negatif .pin::after { background: var(--encre); }
.zc-logo.negatif .dehors { background: #e0796f; box-shadow: 0 0 0 0.035em var(--encre); }

.zc-marque {
  display: flex;
  align-items: center;
  gap: 0.55em;
  font-weight: 800;
  letter-spacing: -0.035em;
  color: var(--encre);
}
.zc-marque .cp { color: var(--ardoise); }

/* ---- Boutons ---- */
.btn {
  font-family: var(--sans);
  font-weight: 700;
  border: 1px solid transparent;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.btn:disabled { opacity: 0.45; cursor: default; }

.btn-bleu { background: var(--bleu); color: #ffffff; }
.btn-bleu:hover:not(:disabled) { background: #1a51b8; }

.btn-ardoise { background: var(--ardoise); color: #ffffff; }
.btn-ardoise:hover:not(:disabled) { background: var(--ardoise-fonce); }

.btn-contour { background: #ffffff; color: var(--encre); border-color: var(--bord); }
.btn-contour:hover:not(:disabled) { border-color: var(--ardoise); }

/* ---- Barre de défilement fine ---- */
.zc-s::-webkit-scrollbar { width: 8px; }
.zc-s::-webkit-scrollbar-thumb { background: rgba(110, 130, 150, 0.35); border-radius: 8px; }

/* ---- Leaflet ---- */
.leaflet-container { background: var(--carte-fond); font-family: inherit; }
.leaflet-control-attribution { font-size: 9px !important; }
