:root { --bleu: #1d4ed8; --gris: #f3f4f6; }
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 system-ui, sans-serif; color: #111; }
header { display: flex; gap: 1rem; align-items: center; justify-content: space-between;
         flex-wrap: wrap; padding: .75rem 1.25rem; background: var(--gris);
         border-bottom: 1px solid #d1d5db; }
header form { margin: 0; }
main { padding: 1.25rem; max-width: 70rem; }
.formulaire { display: grid; gap: .5rem; max-width: 22rem; }
label { font-weight: 500; }
input, select, button { padding: .5rem; font: inherit; }
button { background: var(--bleu); color: #fff; border: 0; border-radius: 4px;
         cursor: pointer; }
button:hover { background: #1e40af; }
:focus-visible { outline: 3px solid #f59e0b; outline-offset: 2px; }
.flash { padding: .6rem .9rem; border-radius: 4px; background: #fef3c7; }
.flash.erreur { background: #fee2e2; }

/* Ajouts pour map.html — à coller à la fin de app/static/style.css */

.barre-outils {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: .75rem;
  flex-wrap: wrap;
}
.vue-toggle button {
  padding: .4rem .9rem;
  border: 1px solid #ccc;
  background: #f7f7f7;
  cursor: pointer;
}
.vue-toggle button.active { background: #2b6cb0; color: #fff; border-color: #2b6cb0; }
#compteur-resultats { flex: 1; margin: 0; font-size: .95rem; }
.bouton-export {
  padding: .4rem .9rem;
  background: #2f855a;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
}

.disposition { display: flex; gap: 1rem; align-items: flex-start; }

#panneau-filtres {
  width: 240px;
  flex: 0 0 240px;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.champ-filtre label { display: block; font-weight: 600; margin-bottom: .25rem; }
.champ-filtre select, .champ-filtre input[type="search"] { width: 100%; }
.champ-case label { display: flex; align-items: center; gap: .4rem; font-weight: normal; }
#btn-reset-filtres { padding: .4rem; cursor: pointer; }

#vue-carte-conteneur, #vue-tableau-conteneur { flex: 1; min-width: 0; }
#carte { height: 70vh; min-height: 420px; width: 100%; }

#tableau-entreprises { width: 100%; border-collapse: collapse; }
#tableau-entreprises th, #tableau-entreprises td {
  border-bottom: 1px solid #e2e2e2;
  padding: .4rem .6rem;
  text-align: left;
  font-size: .9rem;
}

@media (max-width: 800px) {
  .disposition { flex-direction: column; }
  #panneau-filtres { width: 100%; flex: none; }
}