/*
 * EARONTECH — REPÈRES DE MAINTENANCE
 * Écrans : Ajout et suppression des documents, commandes des fichiers et galeries de médias.
 * Chargement : private/view.php.
 * Interactions : public/documents-ui.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.
 */

/* Accès directs aux documents fournisseurs, avec les couleurs et tailles du thème. */
.product-document-shortcuts  {
  display:inline-flex;
  align-items:center;
  gap:4px;
  vertical-align:middle;
}

.product-card-file-actions  {
  display:inline-flex;
  align-items:center;
  gap:4px;
  flex-wrap:nowrap;
  max-width:100%;
  vertical-align:middle;
}

.product-card-file-actions > .product-document-shortcuts  {
  flex-shrink:0;
}

body.platform-appearance .product-card-file-actions > button,body.platform-appearance .product-card-file-actions > a  {
  margin:0;
  width:auto;
  min-width:0;
}

body.platform-appearance a.product-document-button  {
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:var(--app-control-height,26px)!important;
  min-width:var(--app-control-height,26px)!important;
  height:var(--app-control-height,26px)!important;
  min-height:var(--app-control-height,26px)!important;
  flex:0 0 var(--app-control-height,26px);
  padding:0!important;
  margin:0!important;
  border:1px solid var(--app-primary-border,#bfd6e7);
  border-radius:5px;
  background:var(--app-primary-soft,#edf5fb);
  color:var(--app-primary-color,#1c75bc);
  text-decoration:none;
}

body.platform-appearance a.product-document-button svg  {
  width:calc(16px * var(--app-buttons-scale,1));
  height:calc(16px * var(--app-buttons-scale,1));
  flex:none;
}

body.platform-appearance a.product-document-button:hover  {
  background:var(--app-button-hover,#175f99);
  color:var(--app-button-text,#fff);
}

body.platform-appearance a.product-document-button:focus-visible  {
  outline:2px solid var(--app-primary-color,#1c75bc);
  outline-offset:2px;
}

/* Documents communs : visionneuse à gauche et liste compacte à droite. */
.technology-documents:has(.technology-preview),.client-document-columns  {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:14px;
}

.technology-documents > .technology-preview,.client-document-columns > .technology-preview  {
  grid-column:1;
  grid-row:1;
  min-width:0;
}

.technology-documents > :first-child:not(.technology-preview),.client-document-columns > :first-child  {
  grid-column:2;
  grid-row:1;
  min-width:0;
}

.document-list,.client-document-list  {
  list-style:none;
  padding:0;
}

.document-list > li,.client-document-list > li  {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  padding:7px 0;
  border-bottom:1px solid #dde5ed;
  font-size:calc(11px * var(--app-font-scale, 1));
}

.document-list .attachment-name  {
  flex:1;
  min-width:0;
  overflow-wrap:anywhere;
}

.document-row-actions,.supplier-document-actions,.edition-document-actions  {
  display:flex;
  align-items:center;
  gap:4px;
  flex-wrap:wrap;
}

.document-list button,.document-list .button,.client-document-list button,.client-document-list .button  {
  font-size:calc(11px * var(--app-font-scale, 1));
  padding:4px 6px;
}

.attachment-download svg  {
  width:16px;
  height:16px;
}

.document-add-dialog  {
  width:min(480px,90vw);
  max-height:80vh;
  overflow:auto;
  border:1px solid #cbd8e4;
  border-radius:8px;
  padding:18px;
}

.document-add-dialog::backdrop  {
  background:#102c5066;
}

.document-add-dialog h2  {
  font-size:calc(16px * var(--app-font-scale, 1));
  color:var(--app-primary-color, #1c75bc);
}

.document-add-dialog .field  {
  display:block;
  margin:10px 0;
}

.document-add-dialog button  {
  margin:5px 5px 0 0;
}

@media(max-width:650px) {
  .technology-documents:has(.technology-preview),.client-document-columns  {
    display:flex;
    flex-direction:column;
  }

}

.product-media.product-media-unified  {
  display:block;
}

.product-media-unified .product-media-actions  {
  display:flex;
  gap:8px;
  margin-bottom:12px;
}

.product-media-unified .product-media-cards  {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:12px;
}

.product-media-unified [data-gallery-list],.product-media-unified [data-video-list],.product-media-unified .image-gallery  {
  display:contents;
}

.document-row-actions form  {
  margin:0;
  display:inline-flex;
}

.document-row-sharing  {
  flex-basis:100%;
  font-size:calc(11px * var(--app-font-scale, 1));
}

/* Médias : compteurs en entête et commandes compactes dans chaque carte. */
.product-media-unified .product-media-actions  {
  align-items:center;
  flex-wrap:wrap;
}

.product-media-count  {
  font-size:calc(11px * var(--app-font-scale, 1));
  color:#6b7280;
}

.product-media-unified .gallery-card figcaption > .attachment-name  {
  display:block;
  font-size:calc(11px * var(--app-font-scale, 1))!important;
  font-weight:normal;
  overflow-wrap:anywhere;
}

.product-media-unified .gallery-card figcaption > .attachment-name small  {
  display:inline;
  font-size:calc(9px * var(--app-font-scale, 1))!important;
  color:#777;
  white-space:nowrap;
}

.product-media-unified .gallery-card-footer  {
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  align-items:center;
  gap:8px;
  margin-top:7px;
}

.product-media-unified .gallery-card-footer .gallery-actions  {
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:0;
}

.product-media-unified .gallery-card-footer .gallery-actions button  {
  order:-1;
}

.product-media-unified .gallery-card-footer .gallery-actions button,.product-media-unified .gallery-card-footer .gallery-actions a  {
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:26px;
  min-height:0;
  margin:0;
  padding:4px;
  box-sizing:border-box;
}

.product-media-unified .gallery-card-footer .gallery-options  {
  display:flex;
  flex-direction:column;
  gap:5px;
  margin:0;
  padding:0;
  border:0;
}

.product-media-unified .gallery-card-footer .gallery-options label  {
  display:flex;
  align-items:center;
  gap:4px;
  margin:0;
  font-size:calc(11px * var(--app-font-scale, 1))!important;
}