.btn,
button {
  display: inline-block;
  padding: 10px 16px;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none;
  border: none;
  cursor: pointer;
  min-width: 150px;
  text-align: center;
  box-sizing: border-box;
}

.btn-primary {
  background: #2563eb;
  color: white;
}

.btn-danger {
  background: #dc2626;
  color: white;
}

.btn-secondary {
  background: #6b7280;
  color: white;
}

.btn-success {
  background: #16a34a;
  color: white;
}


/* --- BOUTONS MODERNES --- */

.btn-group {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.btn {
  padding: 10px 18px;
  border-radius: 8px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  min-width: 140px;
  text-align: center;
  transition: all 0.2s ease;
}

.btn-primary {
  background: #2563eb;
  color: white;
}

.btn-primary:hover {
  background: #1d4ed8;
}

.btn-secondary {
  background: #e5e7eb;
  color: #111827;
}

.btn-secondary:hover {
  background: #d1d5db;
}

.btn-danger {
  background: #dc2626;
  color: white;
}

.btn-danger:hover {
  background: #b91c1c;
}

.btn-outline {
  background: transparent;
  border: 1px solid #d1d5db;
  color: #374151;
}

.btn-outline:hover {
  background: #f3f4f6;
}


/* --- Boutons fiche bien --- */
.btn-row,
.btn-group {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.btn,
button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 130px;
  height: 42px;
  padding: 0 16px;
  border-radius: 10px;
  border: 0;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
}

.btn-primary {
  background: #243f96;
  color: #fff;
}

.btn-secondary {
  background: #e5e7eb;
  color: #111827;
}

.btn-danger {
  background: #dc2626;
  color: #fff;
}

.btn-outline {
  background: #fff;
  color: #243f96;
  border: 1px solid #243f96;
}

.inline-form {
  display: inline;
  margin: 0;
}

/* === UI PRO : boutons, icônes, formulaires === */

label {
  display: block;
  margin: 10px 0 4px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #4b5563;
}

input,
select,
textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.95rem;
  padding: 9px 11px;
  border: 1px solid #d1d5db;
  border-radius: 9px;
  background: #fff;
  color: #111827;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.btn,
button,
input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: auto;
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: transform .08s ease, box-shadow .08s ease, background .08s ease;
}

.btn:hover,
button:hover,
input[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0,0,0,.08);
}

.btn-primary {
  background: #2563eb;
  color: #fff;
}

.btn-secondary,
.btn-outline {
  background: #f3f4f6;
  color: #374151;
  border-color: #d1d5db;
}

.btn-success {
  background: #16a34a;
  color: #fff;
}

.btn-danger {
  background: #dc2626;
  color: #fff;
}

.btn-warning {
  background: #f59e0b;
  color: #111827;
}

.btn-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  padding: 0;
  border-radius: 999px;
  font-size: 1rem;
}

.btn-row,
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

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

form {
  max-width: 100%;
}

.card form {
  display: grid;
  gap: 6px;
}

table .btn,
table button {
  padding: 6px 9px;
  font-size: 0.8rem;
}

/* Icônes simples (sans bouton) */
.icon-link {
  text-decoration: none;
  font-size: 1.1rem;
  cursor: pointer;
  padding: 2px;
  display: inline-block;
  transition: transform 0.1s ease, opacity 0.1s ease;
}

.icon-link:hover {
  transform: scale(1.2);
  opacity: 0.8;
}

.icon-link[title]:hover::after {
  /* option tooltip custom si besoin plus tard */
}

/* === RESET FORMULAIRES PROPRES === */

.card form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px 16px;
  align-items: end;
}

.card form br {
  display: none;
}

.card form label {
  margin: 0 0 4px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #6b7280;
  letter-spacing: .01em;
}

.card form input,
.card form select,
.card form textarea {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 0.92rem;
  background: #ffffff;
}

.card form button:not(.icon-link),
.card form .btn:not(.icon-link) {
  width: fit-content;
  min-width: 120px;
}

/* Formulaires inline dans les tableaux */
.inline-form {
  display: inline;
  margin: 0;
}

.inline-form button.icon-link {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* === ICÔNES SEULES, SANS STYLE BOUTON === */

.icon-link,
a.icon-link,
button.icon-link {
  all: unset;
  display: inline-block;
  cursor: pointer;
  font-size: 1.15rem;
  line-height: 1;
  padding: 2px 4px;
  text-decoration: none;
  vertical-align: middle;
}

.icon-link:hover,
a.icon-link:hover,
button.icon-link:hover {
  transform: scale(1.18);
  opacity: .75;
}

.btn-row,
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

/* Retire l'effet bouton des anciennes icônes encore en .btn */
a.btn.btn-icon,
button.btn.btn-icon {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-width: auto !important;
  width: auto !important;
  height: auto !important;
  padding: 2px 4px !important;
  border-radius: 0 !important;
  color: inherit !important;
  font-size: 1.15rem !important;
}

/* === Colonnes d'icônes dans les tableaux === */
.icon-col {
  width: 70px;
  text-align: center;
  white-space: nowrap;
}

th.icon-col {
  font-size: 0.72rem;
  font-weight: 700;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: .03em;
}

td.icon-col {
  vertical-align: middle;
}

td.icon-col .icon-link {
  font-size: 1.15rem;
}

/* === Colonnes icônes uniformes === */

th.icon-col,
td.icon-col {
  width: 55px;
  min-width: 55px;
  max-width: 55px;
  text-align: center;
  vertical-align: middle;
  padding: 6px 4px;
}

/* Centrage parfait de l'icône */
td.icon-col {
  display: table-cell;
}

td.icon-col .icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* Ajuste la taille des icônes */
.icon-link {
  font-size: 1.15rem;
  line-height: 1;
}

/* En-têtes plus propres */
th.icon-col {
  font-size: 0.7rem;
  font-weight: 700;
  color: #6b7280;
  letter-spacing: .04em;
}

/* === Fix chevauchement headers icônes === */

/* Colonnes icônes un peu plus larges */
th.icon-col,
td.icon-col {
  width: 75px;
  min-width: 75px;
  max-width: 75px;
  text-align: center;
  vertical-align: middle;
  padding: 6px 4px;
}

/* Labels multi-lignes propres */
th.icon-col {
  font-size: 0.68rem;
  font-weight: 700;
  color: #6b7280;
  letter-spacing: .03em;
  white-space: normal;      /* autorise retour ligne */
  line-height: 1.1;
  text-align: center;
}

/* Option : casse les mots longs proprement */
th.icon-col {
  word-break: break-word;
}

/* Centrage icônes */
td.icon-col .icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* Améliore lisibilité globale tableau */
table {
  table-layout: fixed;
  width: 100%;
}

/* === Actions en une seule colonne === */

.actions-cell {
  white-space: nowrap;
  text-align: center;
  min-width: 140px;
}

.actions-cell .icon-link,
.inline-form .icon-link {
  all: unset;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.45rem;
  line-height: 1;
  margin: 0 6px;
  vertical-align: middle;
  text-decoration: none;
  transition: transform .1s ease, opacity .1s ease;
}

.actions-cell .icon-link:hover,
.inline-form .icon-link:hover {
  transform: scale(1.22);
  opacity: .78;
}

.inline-form {
  display: inline-flex;
  margin: 0;
  padding: 0;
}

th.icon-col,
td.icon-col {
  width: auto !important;
  min-width: auto !important;
  max-width: none !important;
}

table {
  table-layout: auto !important;
}

/* === FIX ALIGNEMENT ACTIONS === */

.actions-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  white-space: nowrap;
}

/* important : empêche les formulaires de casser l'alignement */
.actions-cell .inline-form {
  display: inline-flex;
  margin: 0;
  padding: 0;
}

/* icônes propres */
.actions-cell .icon-link,
.actions-cell button.icon-link {
  all: unset;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.4rem;
  line-height: 1;
  text-decoration: none;
  transition: transform 0.1s ease, opacity 0.1s ease;
}

.actions-cell .icon-link:hover,
.actions-cell button.icon-link:hover {
  transform: scale(1.2);
  opacity: 0.75;
}

/* === Centrage header ACTIONS === */
th.actions-col {
  text-align: center;
  vertical-align: middle;
}

/* === Champs formulaire visibles === */

input,
select,
textarea {
  border: 1px solid #e5e7eb;   /* gris très pâle */
  border-radius: 6px;
  background: #ffffff;
}

/* Hover léger */
input:hover,
select:hover,
textarea:hover {
  border-color: #d1d5db;
}

/* Focus propre (important UX) */
input:focus,
select:focus,
textarea:focus {
  border-color: #9ca3af;
  outline: none;
  box-shadow: 0 0 0 2px rgba(156, 163, 175, 0.2);
}


/* === FORMULAIRE LISIBLE (fix contraste) === */

.card form {
  background: #ffffff;
  padding: 14px;
  border-radius: 10px;
}

/* Champs */
input,
select,
textarea {
  border: 1px solid #d1d5db;     /* gris visible */
  background: #ffffff;           /* blanc franc */
  color: #111827;                /* texte foncé */
  border-radius: 6px;
}

/* Hover */
input:hover,
select:hover,
textarea:hover {
  border-color: #9ca3af;
}

/* Focus */
input:focus,
select:focus,
textarea:focus {
  border-color: #2563eb;         /* bleu clair */
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
  outline: none;
}

/* Labels */
label {
  color: #374151;                /* plus foncé */
  font-weight: 600;
}

/* Placeholder */
input::placeholder {
  color: #9ca3af;
}

/* Checkbox */
input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #2563eb;
}

/* Alignement propre des blocs */
.card form > div {
  display: flex;
  flex-direction: column;
}

/* Espace entre les lignes */
.card form {
  gap: 12px 16px;
}

/* Bouton */
.card form button {
  margin-top: 8px;
}

/* === FORMULAIRES LISIBLES === */

.card form {
  background: #ffffff;
  padding: 14px;
  border-radius: 10px;
  gap: 12px 16px;
}

.card form > div {
  display: flex;
  flex-direction: column;
}

label {
  color: #374151;
  font-weight: 600;
  font-size: 0.82rem;
}

input,
select,
textarea {
  border: 1px solid #d1d5db !important;
  background: #ffffff !important;
  color: #111827 !important;
  border-radius: 7px;
  min-height: 38px;
}

input:hover,
select:hover,
textarea:hover {
  border-color: #9ca3af !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
  outline: none;
}

input::placeholder {
  color: #9ca3af;
}

input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #2563eb;
}

.card form button {
  margin-top: 8px;
}

/* === Actions formulaires édition === */
.form-actions,
.card form .form-actions {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  margin-top: 12px;
}

.form-actions .icon-link {
  font-size: 1.45rem;
}

/* Actions écritures */
.actions-cell {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
}

.actions-cell .icon-link {
  font-size: 1.3rem;
}

.fa-file-pdf {
  color: #dc2626;   /* rouge PDF */
  font-size: 1.2rem;
}

/* === Écritures : icônes alignées === */

.icon-cell {
  text-align: center;
  white-space: nowrap;
}

.actions-cell {
  white-space: nowrap;
  text-align: center;
}

.actions-cell,
.icon-cell {
  vertical-align: middle;
}

.actions-cell .icon-link,
.icon-cell .icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 6px;
  font-size: 1.35rem;
  line-height: 1;
}

.actions-cell .inline-form {
  display: inline-flex;
  margin: 0;
  padding: 0;
  vertical-align: middle;
}

/* === Centrage headers QUITTANCE / ACTIONS === */

th.icon-cell,
th.actions-cell {
  text-align: center;
  vertical-align: middle;
}

/* === Header fiche bien === */

.header-actions {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 10px;
}

.header-actions .icon-link {
  font-size: 1.6rem;
}

/* === HEADER FICHE BIEN === */

.header-bien {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.header-bien h1 {
  margin: 0;
  font-size: 1.6rem;
  color: #111827;
}

/* actions à droite */
.header-actions {
  display: flex;
  gap: 18px;
  align-items: center;
}

/* icônes */
.header-actions .icon-link {
  font-size: 1.6rem;
  cursor: pointer;
  transition: transform 0.12s ease, opacity 0.12s ease;
}

.header-actions .icon-link:hover {
  transform: scale(1.2);
  opacity: 0.75;
}

/* suppression en rouge */
.header-actions button.icon-link {
  color: #dc2626;
}

/* inline form propre */
.header-actions .inline-form {
  display: inline-flex;
  margin: 0;
}

/* === Résumé du bien moderne === */

.property-summary {
  padding: 22px;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.property-summary p {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: 12px;
  align-items: baseline;
  margin: 8px 0;
  padding: 6px 0;
  border-bottom: 1px solid #f3f4f6;
}

.property-summary p:last-child {
  border-bottom: none;
}

.property-summary strong {
  color: #374151;
  font-size: 0.92rem;
}

.property-summary hr {
  border: none;
  border-top: 1px solid #e5e7eb;
  margin: 18px 0;
}

.header-bien {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}

.header-actions {
  display: flex;
  gap: 18px;
  align-items: center;
}

.header-actions .icon-link {
  font-size: 1.55rem;
}

/* === Résumé du bien : alignement propre === */

.card p {
  margin: 7px 0;
}

.card p strong {
  display: inline-block;
  min-width: 220px;
  color: #374151;
  font-weight: 700;
}

.card hr {
  border: none;
  border-top: 1px solid #e5e7eb;
  margin: 16px 0;
}

/* === Résumé du bien : alignement compact === */

.card p strong {
  min-width: 140px;   /* réduit */
}

/* option encore plus propre */
.card p {
  display: flex;
  gap: 10px;
  align-items: baseline;
}

.card p strong {
  flex-shrink: 0;
}

/* === Résumé du bien : alignement grille propre === */

.card p {
  display: grid !important;
  grid-template-columns: 145px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: 8px 0;
}

.card p strong {
  min-width: 0 !important;
  width: auto !important;
  display: block;
  white-space: nowrap;
}

.card p {
  border-bottom: 1px solid #f1f5f9;
  padding-bottom: 8px;
}

.card p:last-child {
  border-bottom: none;
}

/* === Résumé du bien : alignement forcé et ciblé === */

.resume-bien p {
  display: grid !important;
  grid-template-columns: 130px 1fr !important;
  column-gap: 12px !important;
  align-items: start !important;
  justify-content: start !important;
  text-align: left !important;
  margin: 8px 0 !important;
  padding: 6px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.resume-bien p strong {
  display: block !important;
  min-width: 0 !important;
  width: 130px !important;
  white-space: nowrap !important;
  text-align: left !important;
}

.resume-bien p:last-child {
  border-bottom: none !important;
}

/* === Résumé du bien : correction finale alignement === */

.resume-bien p {
  display: block !important;
  text-align: left !important;
  margin: 8px 0 !important;
  padding: 6px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.resume-bien p strong {
  display: inline-block !important;
  width: 130px !important;
  min-width: 130px !important;
  max-width: 130px !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
  text-align: left !important;
  white-space: nowrap !important;
}

.resume-bien p:last-child {
  border-bottom: none !important;
}

/* === Card résumé du bien propre === */

.resume-card {
  padding: 22px !important;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
}

.resume-card h2 {
  margin: 0 0 18px;
  font-size: 1.45rem;
  color: #111827;
}

.resume-grid {
  display: grid;
  grid-template-columns: 210px 1fr;
  column-gap: 18px;
  row-gap: 0;
}

.resume-label,
.resume-value {
  padding: 9px 0;
  border-bottom: 1px solid #f1f5f9;
}

.resume-label {
  font-weight: 700;
  color: #374151;
  white-space: nowrap;
}

.resume-value {
  color: #111827;
  text-align: left;
}

.resume-separator {
  grid-column: 1 / -1;
  height: 10px;
  border-bottom: 1px solid #e5e7eb;
  margin-bottom: 8px;
}

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

  .resume-label {
    padding-bottom: 2px;
    border-bottom: none;
  }

  .resume-value {
    padding-top: 0;
  }
}

/* === Résumé du bien : cards alignées === */

.property-summary {
  padding: 20px !important;
}

.property-summary h2 {
  margin: 0 0 18px;
}

.summary-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.summary-panel {
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 16px;
  background: #ffffff;
}

.summary-panel h3 {
  margin: 0 0 14px;
  font-size: 1.05rem;
}

.summary-row {
  display: grid;
  grid-template-columns: 135px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid #f1f5f9;
  align-items: start;
}

.summary-row:last-child {
  border-bottom: none;
}

.summary-label {
  font-weight: 700;
  color: #374151;
  white-space: nowrap;
}

.summary-value {
  color: #111827;
  text-align: left;
  word-break: break-word;
}

@media (max-width: 950px) {
  .summary-cards {
    grid-template-columns: 1fr;
  }
}

/* === Actions sous résumé === */

.summary-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 22px;
  margin-top: 18px;
}

.summary-actions .icon-link {
  font-size: 1.6rem;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.summary-actions .icon-link:hover {
  transform: scale(1.2);
  opacity: 0.7;
}

.summary-actions button.icon-link {
  color: #dc2626;
}

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

/* === Pagination écritures === */

.pagination-ecritures {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #e5e7eb;
  font-size: 0.9rem;
  color: #4b5563;
}

.pagination-actions {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

.pagination-actions .icon-link {
  font-size: 1.35rem;
}


/* === Indicateurs financiers : alignement ciblé === */

.financial-summary p {
  display: grid !important;
  grid-template-columns: 220px 1fr !important;
  gap: 12px !important;
  align-items: baseline !important;
  text-align: left !important;
  margin: 8px 0 !important;
  padding: 6px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

.financial-summary p strong {
  display: block !important;
  min-width: 0 !important;
  width: auto !important;
  text-align: left !important;
  color: #374151 !important;
}

.financial-summary p span {
  justify-self: start !important;
  text-align: left !important;
}

.financial-summary p:last-child {
  border-bottom: none !important;
}

/* === Card indicateurs financiers propre === */

.financial-card {
  padding: 22px !important;
}

.financial-card h2 {
  margin: 0 0 22px;
}

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

.financial-panel h3 {
  margin: 0 0 18px;
  font-size: 1.1rem;
}

.financial-row {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) auto;
  gap: 14px;
  align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px solid #f1f5f9;
}

.financial-row:last-child {
  border-bottom: none;
}

.financial-label {
  font-weight: 700;
  color: #374151;
  text-align: left;
}

.financial-value {
  font-weight: 500;
  color: #111827;
  text-align: right;
  white-space: nowrap;
}

.financial-value.positive {
  color: #16a34a;
  font-weight: 800;
}

.financial-value.negative {
  color: #dc2626;
  font-weight: 800;
}

@media (max-width: 1050px) {
  .financial-grid {
    grid-template-columns: 1fr;
  }
}

/* === Harmonisation champs formulaire === */

input,
select,
textarea {
  min-height: 42px !important;
  height: 42px;
  line-height: 1.2;
  padding: 9px 12px !important;
  box-sizing: border-box;
}

textarea {
  height: auto;
  min-height: 42px !important;
}

/* Select : même rendu que les inputs */
select {
  appearance: auto;
  background-color: #fff;
}

/* === Message bloc Baux pleine largeur === */

details.card p {
  max-width: none !important;
}

details.card > p {
  width: 100%;
}

/* Message informatif dans Baux */
details.card p[style*="color:#6b7280"],
details.card p[style*="color: #6b7280"] {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  padding: 14px 16px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  line-height: 1.45;
}

/* === Formulaire écriture propre === */

.form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px 22px;
  align-items: start;
}

.form-group {
  display: flex;
  flex-direction: column;
}

.form-group label {
  font-size: 0.85rem;
  color: #6b7280;
  margin-bottom: 6px;
  font-weight: 600;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
}

/* ligne large (ex: libellé) */
.form-group.full {
  grid-column: span 2;
}

/* bouton + centré */
.form-actions {
  display: flex;
  align-items: center;
  justify-content: center;
}

.form-actions button {
  font-size: 1.6rem;
}

/* checkbox alignée */
.form-inline {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
}

/* responsive */
@media (max-width: 900px) {
  .form-grid {
    grid-template-columns: 1fr;
  }

  .form-group.full {
    grid-column: span 1;
  }
}

/* === Formulaire ajout écriture propre === */

.form-ecriture {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px 22px !important;
  align-items: end !important;
  padding: 18px !important;
  background: #ffffff !important;
  border-radius: 12px !important;
}

.form-ecriture .form-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.form-ecriture label {
  margin: 0 !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  color: #6b7280 !important;
}

.form-ecriture input,
.form-ecriture select {
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
}

.form-ecriture .form-wide {
  grid-column: span 2 !important;
}

.form-ecriture .form-checkline {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  height: 42px !important;
}

.form-ecriture .form-checkline input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
}

.form-ecriture .form-checkline label {
  margin: 0 !important;
}

.form-ecriture .form-submitline {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 42px !important;
}

.form-ecriture .form-submitline .icon-link {
  font-size: 1.7rem !important;
}

@media (max-width: 900px) {
  .form-ecriture {
    grid-template-columns: 1fr !important;
  }

  .form-ecriture .form-wide {
    grid-column: span 1 !important;
  }
}

/* === Datepicker visible === */
.flatpickr-calendar {
  z-index: 999999 !important;
}

.js-datepicker {
  cursor: pointer;
  background: #ffffff !important;
}

/* === Flatpickr : contraste amélioré === */

.flatpickr-calendar {
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18) !important;
  border-radius: 12px !important;
  overflow: hidden;
}

.flatpickr-months {
  background: #1e3a8a !important;
}

.flatpickr-current-month,
.flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
  color: #ffffff !important;
  font-weight: 700 !important;
}

.flatpickr-weekdays {
  background: #f1f5f9 !important;
}

span.flatpickr-weekday {
  color: #374151 !important;
  font-weight: 700 !important;
}

.flatpickr-day {
  color: #111827 !important;
  border-radius: 8px !important;
}

.flatpickr-day:hover {
  background: #dbeafe !important;
  border-color: #bfdbfe !important;
}

.flatpickr-day.today {
  border-color: #2563eb !important;
  color: #1d4ed8 !important;
  font-weight: 700 !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}

.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: #94a3b8 !important;
}

/* === Fix mois dropdown Flatpickr === */

.flatpickr-monthDropdown-months {
  background: #1e3a8a !important;
  color: #ffffff !important;
  border: none !important;
}

.flatpickr-monthDropdown-months option {
  background: #ffffff !important;
  color: #111827 !important;
}

.flatpickr-monthDropdown-months option:checked {
  background: #2563eb !important;
  color: #ffffff !important;
}


/* === Flatpickr : correction alignement mois / année === */

.flatpickr-calendar {
  width: 310px !important;
}

.flatpickr-months,
.flatpickr-month {
  height: 48px !important;
}

.flatpickr-current-month {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  height: 48px !important;
  padding: 0 !important;
  left: 12.5% !important;
  width: 75% !important;
  top: 0 !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  height: 36px !important;
  line-height: 36px !important;
  padding: 0 8px !important;
  margin: 0 !important;
  text-align: center !important;
  font-size: 1.15rem !important;
}

.flatpickr-current-month .numInputWrapper {
  height: 36px !important;
  width: 70px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.flatpickr-current-month input.cur-year {
  height: 36px !important;
  line-height: 36px !important;
  padding: 0 !important;
  font-size: 1rem !important;
  text-align: center !important;
}

.flatpickr-prev-month,
.flatpickr-next-month {
  height: 48px !important;
  padding: 13px !important;
}

/* === Flatpickr : navigation mois par flèches uniquement === */

.flatpickr-current-month {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  left: 15% !important;
  width: 70% !important;
}

.flatpickr-current-month .cur-month {
  color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 1.2rem !important;
  margin-right: 8px !important;
}

.flatpickr-current-month input.cur-year {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
  background: transparent !important;
  border: none !important;
  pointer-events: none !important;
  box-shadow: none !important;
}

.flatpickr-current-month .numInputWrapper {
  width: 65px !important;
}

.flatpickr-current-month .arrowUp,
.flatpickr-current-month .arrowDown {
  display: none !important;
}

.flatpickr-prev-month,
.flatpickr-next-month {
  color: #ffffff !important;
  fill: #ffffff !important;
  top: 0 !important;
  height: 48px !important;
}

.flatpickr-prev-month:hover,
.flatpickr-next-month:hover {
  background: rgba(255,255,255,0.12) !important;
}

.flatpickr-prev-month svg,
.flatpickr-next-month svg {
  fill: #ffffff !important;
}

/* === Résumé du bien : correction chevauchement labels/valeurs === */

.summary-row {
  grid-template-columns: minmax(190px, 42%) minmax(0, 1fr) !important;
  column-gap: 22px !important;
}

.summary-label {
  white-space: normal !important;
  line-height: 1.15 !important;
}

.summary-value {
  min-width: 0 !important;
  text-align: left !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

/* === Locataires liés : actions alignées proprement === */

/* centre le header ACTIONS */
table th:last-child {
  text-align: center !important;
}

/* cellule actions */
table td:last-child {
  text-align: center !important;
}

/* conteneur icônes */
table td:last-child .icon-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
}

/* icônes */
table td:last-child .icon-link a,
table td:last-child .icon-link button {
  font-size: 1.4rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

/* empêche le retour à la ligne */
table td:last-child .icon-link {
  white-space: nowrap !important;
}

/* formulaire inline propre */
table td:last-child form.inline-form {
  display: inline-flex !important;
  margin: 0 !important;
}

/* === Pagination type DataTables pour les écritures === */

.table-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin: 12px 0 14px;
  color: #4b5563;
  font-size: 0.9rem;
}

.table-toolbar select {
  width: auto !important;
  min-width: 80px;
  height: 34px !important;
  min-height: 34px !important;
  padding: 4px 8px !important;
  margin: 0 6px;
}

.table-toolbar input {
  width: 240px !important;
  height: 36px !important;
  min-height: 36px !important;
}

.table-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding-top: 12px;
  margin-top: 12px;
  border-top: 1px solid #e5e7eb;
  color: #4b5563;
  font-size: 0.9rem;
}

.table-pagination-actions {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.table-page-btn {
  border: 1px solid #d1d5db;
  background: #ffffff;
  border-radius: 8px;
  padding: 6px 10px;
  cursor: pointer;
  color: #111827;
}

.table-page-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.data-table tbody tr[style*="display: none"] {
  display: none !important;
}

/* Icône oeil dashboard */
.icon-link {
  text-decoration: none;
  font-size: 1.2rem;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.icon-link:hover {
  transform: scale(1.2);
  opacity: 0.7;
}

/* === Dashboard : adresse + icône fiche === */

.dashboard-address {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dashboard-address .icon-link {
  font-size: 1.35rem;
  flex-shrink: 0;
}

/* === Fix icône qui bouge au hover === */

.dashboard-address .icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform-origin: center center !important;
}

.dashboard-address .icon-link:hover {
  transform: scale(1.2);
}

/* évite tout décalage horizontal */
.dashboard-address .icon-link {
  transition: transform 0.15s ease, opacity 0.15s ease;
}

/* === Locataires : actions propres === */

.locataire-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

.locataire-actions .icon-link,
.locataire-actions button.icon-link {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  font-size: 1.3rem;
  cursor: pointer;
}

.locataire-actions button.icon-link:hover,
.locataire-actions a.icon-link:hover {
  opacity: 0.6;
  transform: scale(1.15);
}

/* === Formulaire édition locataire : boutons alignés === */

.form-submitline {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  justify-content: flex-start !important;
}

.form-submitline .icon-link,
.form-submitline button.icon-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.4rem;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer;
}

.form-submitline .icon-link:hover,
.form-submitline button.icon-link:hover {
  transform: scale(1.15);
  opacity: 0.7;
}

/* === FIX HARD : boutons toujours sur une ligne === */

.form-submitline {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  white-space: nowrap !important;
}

/* IMPORTANT : neutralise les comportements parasites */
.form-submitline * {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

/* taille homogène */
.form-submitline .icon-link,
.form-submitline button.icon-link {
  font-size: 1.5rem !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}

/* hover propre */
.form-submitline .icon-link:hover,
.form-submitline button.icon-link:hover {
  transform: scale(1.15);
  opacity: 0.7;
}

/* === Datepicker Baux === */

.js-datepicker-baux {
  cursor: pointer;
  background: #ffffff !important;
}

/* === Boutons icônes uniformes === */

.form-submitline {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 18px;
}

.icon-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.6rem !important;
  background: none !important;
  border: none !important;
  padding: 6px;
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

/* hover propre */
.icon-link:hover {
  transform: scale(1.15);
  opacity: 0.65;
}

/* alignement visuel */
.form-submitline .icon-link {
  line-height: 1;
}

/* === Avenants en enfants de bail === */

.avenant-row td {
  background: #f8fafc !important;
  padding: 8px 16px !important;
}

.avenant-child {
  margin-left: 26px;
  padding: 12px 14px;
  border-left: 4px solid #93c5fd;
  background: #ffffff;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
}

.avenant-date {
  color: #6b7280;
  margin-left: 8px;
  font-size: 0.86rem;
}

.avenant-resume {
  margin-top: 6px;
  color: #374151;
  font-size: 0.9rem;
  line-height: 1.35;
}

.avenant-child form {
  margin: 0;
  flex-shrink: 0;
}

/* === Datepicker Livre de comptes === */
.js-datepicker-comptes {
  cursor: pointer;
  background: #ffffff !important;
}

/* Icône PDF */
.icon-link {
  font-size: 1.4rem;
}

.icon-link[title*="PDF"]:hover {
  color: #dc2626; /* rouge PDF */
}

/* === Settings layout === */
.settings-actions {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.settings-actions .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* === Page paramètres propre === */

.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 22px;
}

.settings-card {
  min-height: 210px;
}

.settings-card h2 {
  margin-bottom: 10px;
}

.settings-card p {
  color: #6b7280;
  max-width: 520px;
  line-height: 1.4;
}

.settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 22px;
}

.settings-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  text-decoration: none;
  color: #111827;
  background: #ffffff;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.settings-link span {
  font-size: 1.35rem;
}

.settings-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  border-color: #cbd5e1;
}

/* === Settings version clean (dashboard) === */

.settings-dashboard {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.settings-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 140px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  text-decoration: none;
  color: #111827;
  transition: all 0.15s ease;
}

.settings-tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.settings-icon {
  font-size: 2rem;
  margin-bottom: 10px;
}

.settings-title {
  font-weight: 600;
  font-size: 1rem;
}

/* === Page bailleur === */

.bailleur-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px 22px !important;
  align-items: end !important;
}

.bailleur-form .form-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.bailleur-form label {
  margin: 0 !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  color: #6b7280 !important;
}

.bailleur-form input {
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
}

.bailleur-form .form-submitline {
  grid-column: 1 / -1;
  display: flex !important;
  flex-direction: row !important;
  gap: 18px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin-top: 10px;
}

.bailleur-form .form-submitline .icon-link {
  font-size: 1.55rem !important;
}

@media (max-width: 850px) {
  .bailleur-form {
    grid-template-columns: 1fr !important;
  }
}

/* === Page configuration mail === */

.mail-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px 22px !important;
  align-items: end !important;
}

.mail-form .form-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.mail-form label {
  margin: 0 !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  color: #6b7280 !important;
}

.mail-form input {
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
}

.mail-form .form-checkline {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  height: 42px !important;
}

.mail-form .form-checkline input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
}

.mail-form .form-checkline label {
  margin: 0 !important;
}

.mail-form .form-submitline {
  grid-column: 1 / -1;
  display: flex !important;
  flex-direction: row !important;
  gap: 18px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin-top: 10px;
}

.mail-form .form-submitline .icon-link {
  font-size: 1.55rem !important;
}

@media (max-width: 850px) {
  .mail-form {
    grid-template-columns: 1fr !important;
  }
}

/* === Changement mot de passe === */

.password-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 520px;
}

.password-form .form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.password-form label {
  font-size: 0.84rem;
  font-weight: 700;
  color: #6b7280;
}

.password-form input {
  width: 100%;
  height: 42px;
}