/* Custom CSS to override django Jet style */
.changelist-toolbar-row {
  margin-bottom: 20px;
}

/* Bouton "+ Ajouter" toujours à droite et aligné avec les filtres (bas du toolbar) */
.changelist-toolbar-row ul.object-tools {
  margin-left: auto;
  align-self: flex-start;
  padding-right: 0px;
}

.changelist-toolbar-row div#toolbar {
  align-self: flex-start;
}

textarea, input {
  max-width: 100%; /* IntraMuros: limit the width of the inputs to be responsive */
}

.django-ckeditor-widget,
[class*="cke_editor_"]:not(.cke_panel) {
  /* Applique max-width: 100% sauf pour .cke_1.cke_panel car cela empèche l'affichage du menu contextuel au clic droit en plein écran */
  max-width: 100%;
  /* IntraMuros: limit the width of the inputs to be responsive */
}

.fileinput-image-preview-block {
  padding: 0px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  box-sizing: border-box;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24' fill='none' stroke='%23ddd' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'%3E%3C/circle%3E%3Cpolyline points='21 15 16 10 5 21'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 48px 48px;
  background-color: #f9f9f9;

}



/* Liens cliquables dans les champs readonly */
.readonly-value a {
  color: #235599;
  text-decoration: underline;
}

.readonly-value a:hover {
  color: #1a3f73;
}

/* Bannière mode lecture seule affichée en haut du formulaire */
.readonly-mode-banner {
  background-color: #fef3cd;
  border: 1px solid #ffc107;
  border-radius: 4px;
  padding: 10px 16px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: #664d03;
}

.readonly-mode-banner .readonly-mode-icon {
  font-size: 16px;
  flex-shrink: 0;
}

/* Field-box readonly dans les lignes multi-champs */
.field-box.readonly-field {
  background-color: #f8fafb;
  border-left: 3px solid #d0dbe6;
  padding-left: 8px;
  border-radius: 4px;
}

/* =====================================================
   READONLY IMAGES - Affichage des images en lecture seule
   ===================================================== */

/* Conteneur image principale readonly */
.readonly-image-container {
  display: inline-block;
  border: 1px solid #e4e9ee;
  border-radius: 6px;
  overflow: hidden;
  background-color: #f8fafb;
  padding: 4px;
}

.readonly-image-preview {
  max-width: 400px;
  max-height: 300px;
  display: block;
  border-radius: 4px;
  object-fit: contain;
}

/* Galerie images secondaires readonly */
.readonly-images-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 4px 0;
}

.readonly-gallery-item {
  display: inline-block;
  border: 1px solid #e4e9ee;
  border-radius: 6px;
  overflow: hidden;
  background-color: #f8fafb;
  padding: 3px;
  transition: box-shadow 0.2s;
}

.readonly-gallery-item:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.readonly-gallery-image {
  width: 120px;
  height: 90px;
  object-fit: cover;
  display: block;
  border-radius: 4px;
}

/* Responsive */
@media (max-width: 960px) {
  .readonly-image-preview {
    max-width: 100%;
  }

  .readonly-gallery-image {
    width: 100px;
    height: 75px;
  }
}

/* Style générique pour tout champ de saisie désactivé : fond grisé, curseur
   "not-allowed", bordure atténuée — pour signaler clairement qu'il n'est pas modifiable. */
input:disabled,
textarea:disabled,
select:disabled {
  background-color: #f0f0f0;
  color: #777;
  border-color: #d0d0d0;
  cursor: not-allowed;
  opacity: 0.85;
}