/*
 * EARONTECH — REPÈRES DE MAINTENANCE
 * Écrans : Demandes fournisseurs : cartes, formulaires et fenêtres de suivi.
 * Chargement : private/view.php.
 * Interactions : public/operations.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.
 */

/* Suivi interne : demandes fournisseurs et logistique des échantillons. */
.operations-dialog {
  width:min(1000px,92vw);
  max-width:92vw;
  max-height:88vh;
  box-sizing:border-box;
  padding:18px;
  overflow:auto
}

.operations-dialog>header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  position:sticky;
  top:-18px;
  background:#fff;
  z-index:2;
  padding:8px 0
}

.operations-dialog>header button {
  font-size:calc(12px * var(--app-font-scale, 1));
  padding:5px 10px
}

.operations-content h2 {
  font-size:calc(18px * var(--app-font-scale, 1));
  color:var(--app-primary-color, #1c75bc)
}

.operations-content h3 {
  font-size:calc(14px * var(--app-font-scale, 1))
}

.operations-content .field {
  font-size:calc(12px * var(--app-font-scale, 1));
  color:var(--app-primary-color, #1c75bc);
  margin-bottom:8px;
  gap:4px
}

.operations-content input,.operations-content select,.operations-content textarea {
  color:#222;
  font-size:calc(12px * var(--app-font-scale, 1));
  padding:6px;
  box-sizing:border-box
}

.operations-content textarea {
  resize:vertical
}

.operations-content fieldset {
  border:1px solid #dbe3eb;
  border-radius:8px;
  padding:12px;
  min-width:0
}

.operations-content legend {
  font-size:calc(13px * var(--app-font-scale, 1));
  color:var(--app-primary-color, #1c75bc)
}

.operations-columns {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:16px
}

.operations-columns>form,.operations-columns>div {
  min-width:0
}

.operations-dates {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px
}

.operations-product-choices {
  max-height:170px;
  overflow:auto;
  display:grid;
  gap:5px
}

.operations-product-choices label {
  font-size:calc(12px * var(--app-font-scale, 1));
  display:flex;
  align-items:center;
  gap:5px
}

.operations-content input[type=checkbox],.operations-filters input[type=checkbox] {
  width:auto
}

.operations-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:12px;
  margin:12px 0
}

.operations-card {
  padding:12px;
  border:1px solid #d6e1ea;
  border-radius:10px;
  background:#fff;
  min-width:0;
  overflow-wrap:anywhere
}

.operations-card h3 {
  font-size:calc(14px * var(--app-font-scale, 1));
  color:var(--app-primary-color, #1c75bc);
  margin:5px 0
}

.operations-card p {
  font-size:calc(12px * var(--app-font-scale, 1));
  margin:7px 0
}

.operations-card small {
  font-size:calc(11px * var(--app-font-scale, 1));
  color:#666
}

.operations-card .button,.operations-content button,.operations-toolbar .button {
  font-size:calc(12px * var(--app-font-scale, 1));
  padding:5px 9px;
  min-height:0
}

.operations-late {
  border-left:4px solid #d60b52
}

.operations-excerpt {
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden
}

.operations-filters,.operations-toolbar {
  display:flex;
  gap:12px;
  align-items:end;
  flex-wrap:wrap;
  margin:12px 0
}

.operations-filters label {
  font-size:calc(12px * var(--app-font-scale, 1))
}

.operations-filters .field {
  margin:0;
  min-width:160px;
  max-width:260px
}

.operations-history {
  max-height:350px;
  overflow:auto;
  font-size:calc(12px * var(--app-font-scale, 1))
}

.operations-history article {
  border-bottom:1px solid #dbe3eb;
  padding:8px 0
}

.operations-history p {
  white-space:pre-wrap;
  margin:5px 0
}

.operations-content [role=status] {
  white-space:pre-wrap;
  color:#a62a40
}

.operations-content button:disabled {
  opacity:.5
}

@media(max-width:750px) {
  /* Présentation commune à ces éléments ; mêmes propriétés et même contexte d’écran. */
  .operations-columns, .operations-dates  {
    grid-template-columns:1fr
  }

  .operations-dialog {
    width:95vw;
    max-width:95vw
  }

}

/* Champs compacts : libellé au-dessus de la saisie, y compris dans les modales. */
.operations-content .field {
  display:flex;
  flex-direction:column;
  align-items:stretch
}

.operations-content .field input,.operations-content .field select,.operations-content .field textarea {
  width:100%;
  min-width:0
}

.operations-dialog {
  border:1px solid #d6e1ea;
  border-radius:12px;
  font-family:inherit
}

.operations-dialog::backdrop {
  background:#142c4855
}

/* Demandes : destinataire, produits détaillés et actions regroupées en pied de carte. */
.operations-request-actions,.operations-card-actions {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap
}

.operations-request-actions label {
  display:flex;
  align-items:center;
  gap:6px;
  font-size:calc(12px * var(--app-font-scale,1))
}

.operations-card-actions {
  margin-top:12px
}

.operations-card-actions button {
  font-size:calc(12px * var(--app-font-scale,1));
  padding:5px 9px
}

.operations-request-products {
  border-top:1px solid #d6e1ea;
  margin-top:10px;
  padding-top:8px
}

.operations-request-products section+section {
  border-top:1px solid #edf0f3;
  padding-top:6px;
  margin-top:8px
}

.operations-request-products h4 {
  margin:4px 0;
  font-size:calc(12px * var(--app-font-scale,1));
  color:var(--app-primary-color,#227e9d)
}

.operations-request-products h4 span {
  font-weight:400;
  color:#68737c;
  font-size:calc(11px * var(--app-font-scale,1))
}

.operations-request-products p {
  font-size:calc(11px * var(--app-font-scale,1));
  line-height:1.4;
  margin:5px 0
}

.operations-email-badge {
  color:var(--app-primary-color,#227e9d)
}

.operations-card [data-operations-delete-status] {
  color:#a62a40
}

.operations-card [data-operations-delete-status]:empty {
  display:none
}

[data-operations-email-result] p {
  font-size:calc(12px * var(--app-font-scale,1));
  color:#47535e
}

/* Produits concernés : accordéons indépendants, fermés lors de l'affichage. */
.operations-request-product {
  border:1px solid #d6e1ea;
  border-radius:6px;
  margin:5px 0;
  background:#fff
}

.operations-request-product>summary {
  padding:7px;
  cursor:pointer;
  font-size:calc(11px * var(--app-font-scale,1));
  color:var(--app-primary-color,#227e9d)
}

.operations-request-product>summary>span {
  display:inline;
  overflow-wrap:anywhere
}

.operations-request-technology {
  display:block;
  margin-top:3px;
  font-size:calc(10px * var(--app-font-scale,1));
  color:#5a6570
}

.operations-request-product>div {
  padding:0 8px 8px
}

.operations-request-product>div .button {
  margin-top:4px
}