/*
 * EARONTECH — REPÈRES DE MAINTENANCE
 * Écrans : Fiches produits, caractéristiques et filtres propres aux adhésifs.
 * Chargement : private/view.php.
 * Interactions : public/adhesives.js.
 * Les couleurs et tailles paramétrables utilisent les variables --app-* / --product-*.
 * Les blocs @media adaptent la même interface à la largeur de l’écran.
 * Conserver l’ordre des règles : les ajustements spécialisés suivent le socle commun.
 */

[data-adhesive-editor] {
  margin-top:1rem
}

.adhesive-measures {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem;
  margin-top:.8rem
}

.adhesive-measure {
  min-width:0;
  border:1px solid var(--app-primary-color,#227e9d);
  border-radius:.5rem;
  padding:.65rem
}

.adhesive-measure h4 {
  margin:0 0 .4rem;
  color:var(--app-primary-color,#227e9d);
  font-size:inherit
}

.adhesive-measure-fields {
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  gap:.35rem .6rem
}

.adhesive-measure-context {
  grid-column:1/-1
}

.adhesive-measure .field {
  margin:0;
  min-width:0
}

.adhesive-measure input,.adhesive-measure textarea {
  width:100%;
  min-width:0
}

@media(max-width:700px) {
  .adhesive-measures {
    grid-template-columns:1fr
  }

}